Visual comparison web page design:...

User 2930662 Photo


Guest
2 posts

Hi,

I would like to create a web page for the purpose of comparing a number of items in a visual style, where I can filter which are visible depending of selectable parameters.

The most similar example of how I would like the page to work is like google maps. There items are located by position on the page, you can change what you’re looking for to show only desired options (e.g. restaurants, hotels etc), & while items are initially shown as small points, when clicked they pop up a box with more information.

I would like the background to be an image on which I can arrange the items in locations based on their properties (e.g. width & height) so each is easily compared to the others when the page is viewed.

I have been trying to find examples of pages like this or methods that others have used to build this but with no luck! Can anyone help me with some ideas of how this might be achieved?
Thanks!
User 2699991 Photo


Registered User
4,782 posts

TJFA wrote:
Hi,

I would like to create a web page for the purpose of comparing a number of items in a visual style, where I can filter which are visible depending of selectable parameters.

The most similar example of how I would like the page to work is like google maps. There items are located by position on the page, you can change what you’re looking for to show only desired options (e.g. restaurants, hotels etc), & while items are initially shown as small points, when clicked they pop up a box with more information.

I would like the background to be an image on which I can arrange the items in locations based on their properties (e.g. width & height) so each is easily compared to the others when the page is viewed.

I have been trying to find examples of pages like this or methods that others have used to build this but with no luck! Can anyone help me with some ideas of how this might be achieved?
Thanks!


Hello
my first reaction to your idea would be that this is going to take some seriously heavy coding with some specialist type of application, so that then begs the question as to how experienced you are at coding?
this then begs another question as to who is going to input the data & how
A/ are you going to do it
or
B/ are you going to allow others to input their details (for example a restaurant in the area can place their own details. etc
this also makes the whole project even more complicated.

HOWEVER,
There may be something that can be done that might work by using the CC applications, but it wouldn't be exactly as you describe

I can envisage using a slider with a number of slides each with the same background image, and each slide having the different items (restaurants/shops/libraries etc ( or whatever your placement items are.
the slides would be accessed by a menu list and would appear over each other seamlessly, or standard sliding properties
so, for example, a menu item link "Restaurants", would bring the appropriate slide into view, which then has the individual subject locations displayed on it, which then when hovered over or clicked would pop up further details about that establishment any further information or further links about the establishment can be[laced within the pop up windiw as desired

clicking on another menu link (eg pet food stores) brings the appropriate slide into view with the same principles.

This also has to be said is not straightforward even using CC software, and would still require a higher level of knowledge, which then brings us back to the first question as to your experience & knowledge.

I wish you the best of luck in your search. & do hope that you can find & achieve your goal.
I will endeavour to put something together as an idea as to what can be done from within Coffecup apps, but it will take me all day. I will place a link here later if & when I get it up & running, so you can see if it sort of fits to your original idea.

wayan



Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2792467 Photo


Registered User
161 posts

The example you gave (Google Maps) is a server based application presenting it's output in HTML (and maybe some javascript). Unless you are an experienced programmer (php or C or similar) and have access to a webserver to run your code, it will be a challenge.
Coffeecup products focus on visually building webpages, not apps.
Eindhoven :: Netherlands

It's easy to see, once you see it.
User 379556 Photo


Registered User
1,533 posts

I'm wondering whether this page might help regarding the basics of such a project, unless something vastly more complex is envisaged.

Frank
User 2699991 Photo


Registered User
4,782 posts

Unless I have completely missed what he is after here are a couple of things done as demo only using just SD 3.5 nothing else

https://youtu.be/KUJOZqtnCYg

https://youtu.be/HEzS2oCjIY4
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 187934 Photo


Senior Advisor
20,181 posts
Online Now

Very nice Wayan. How does it look at lower screen size?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2930662 Photo


Guest
2 posts

Wayan Jaya wrote:

Hello
my first reaction to your idea would be that this is going to take some seriously heavy coding with some specialist type of application, so that then begs the question as to how experienced you are at coding?
this then begs another question as to who is going to input the data & how
A/ are you going to do it
or
B/ are you going to allow others to input their details (for example a restaurant in the area can place their own details. etc
this also makes the whole project even more complicated.

HOWEVER,
There may be something that can be done that might work by using the CC applications, but it wouldn't be exactly as you describe

I can envisage using a slider with a number of slides each with the same background image, and each slide having the different items (restaurants/shops/libraries etc ( or whatever your placement items are.
the slides would be accessed by a menu list and would appear over each other seamlessly, or standard sliding properties
so, for example, a menu item link "Restaurants", would bring the appropriate slide into view, which then has the individual subject locations displayed on it, which then when hovered over or clicked would pop up further details about that establishment any further information or further links about the establishment can be[laced within the pop up windiw as desired

clicking on another menu link (eg pet food stores) brings the appropriate slide into view with the same principles.

This also has to be said is not straightforward even using CC software, and would still require a higher level of knowledge, which then brings us back to the first question as to your experience & knowledge.

I wish you the best of luck in your search. & do hope that you can find & achieve your goal.
I will endeavour to put something together as an idea as to what can be done from within Coffecup apps, but it will take me all day. I will place a link here later if & when I get it up & running, so you can see if it sort of fits to your original idea.

wayan


Wayan thank you for the time you put into this. That's definitely an idea that could work for what I'm after! I'm not very experienced with coding so I may have underestimated the complexity of the idea a bit.
The idea is that I will input the content as data points that I can add to their correct locations on the page. I figured once I work out how to create the filtering method that adding extra points will be fairly straight forward.

Frank Cook wrote:

I'm wondering whether this page might help regarding the basics of such a project, unless something vastly more complex is envisaged.

Frank


Thank you also for that link Frank, looks like a relatively simple way to filter that might help me out a lot trying to prove the concept to myself more than anything else!
User 2699991 Photo


Registered User
4,782 posts

Eric Rohloff wrote:
Very nice Wayan. How does it look at lower screen size?


It's an orbit slider (foundation)with modal windows for the pop up so it works how you would expect it to work at all device widths
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2699991 Photo


Registered User
4,782 posts

TJFA wrote:
Wayan Jaya wrote:

Hello
my first reaction to your idea would be that this is going to take some seriously heavy coding with some specialist type of application, so that then begs the question as to how experienced you are at coding?
this then begs another question as to who is going to input the data & how
A/ are you going to do it
or
B/ are you going to allow others to input their details (for example a restaurant in the area can place their own details. etc
this also makes the whole project even more complicated.

HOWEVER,
There may be something that can be done that might work by using the CC applications, but it wouldn't be exactly as you describe

I can envisage using a slider with a number of slides each with the same background image, and each slide having the different items (restaurants/shops/libraries etc ( or whatever your placement items are.
the slides would be accessed by a menu list and would appear over each other seamlessly, or standard sliding properties
so, for example, a menu item link "Restaurants", would bring the appropriate slide into view, which then has the individual subject locations displayed on it, which then when hovered over or clicked would pop up further details about that establishment any further information or further links about the establishment can be[laced within the pop up windiw as desired

clicking on another menu link (eg pet food stores) brings the appropriate slide into view with the same principles.

This also has to be said is not straightforward even using CC software, and would still require a higher level of knowledge, which then brings us back to the first question as to your experience & knowledge.

I wish you the best of luck in your search. & do hope that you can find & achieve your goal.
I will endeavour to put something together as an idea as to what can be done from within Coffecup apps, but it will take me all day. I will place a link here later if & when I get it up & running, so you can see if it sort of fits to your original idea.

wayan


Wayan thank you for the time you put into this. That's definitely an idea that could work for what I'm after! I'm not very experienced with coding so I may have underestimated the complexity of the idea a bit.
The idea is that I will input the content as data points that I can add to their correct locations on the page. I figured once I work out how to create the filtering method that adding extra points will be fairly straight forward.

Frank Cook wrote:

I'm wondering whether this page might help regarding the basics of such a project, unless something vastly more complex is envisaged.

Frank


Thank you also for that link Frank, looks like a relatively simple way to filter that might help me out a lot trying to prove the concept to myself more than anything else!


no problem
I hope that you can get something that you can use
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?

LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
Contact Me For One To One Assistance
https://alphathemes.coffeecup.com/forms … an%281%29/
User 2931740 Photo


Guest
1 post

Wayan Jaya, thanks for sharing.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.