Hot answers tagged

129

They have (slightly) different meanings and usage Although both icons are similar and both are popularly recognized, they do have slightly different connotations. ❤ The heart icon Is more emotive by its very nature. As such, it's more likely to be associated with positive feelings such as love, like, happy, etc. Is used by popular applications such ...


20

I think the difference between the two isn't huge, both are frequently used for the feature you are describing. Perhaps thinking of the emotion you are trying to evoke is more important. For example, a favourite on this site is represented by a star. This makes sense, it's a 'professional' site. Whereas if I'm on a site like say AirBNB, a heart makes ...


9

Since the objective is to favorite a location in a mobile the recommendation would be a GEO-HEART. This is the ideal graphical representation to portray the favorite location.


8

tl;dr: It's a sheet. The pattern is related to the persistent bottom sheet element on mobile. The MD guidelines actually reference the map example specifically when explaining this approach: On desktop, content ordinarily presented in a persistent bottom sheet might move onto a new sheet of material. On larger screens it may be more appropriate to ...


6

Getting in the trap of scrolling map area instead of page scrolling is definitely bad experience. Still current solution looks overcomplicated and provides a barrier to interaction. The design looks a bit contradictory: large map area assumes reach user interaction with map content (primary task), but scrolling beyond map control looks like users don't need ...


6

Examples 1-3 could be individually plotted using a heat map. Yes, it may be reasonable if you have high resolution data. In this representation heat map is an invaluable tool (besides opinable choice of color pair): However if you do not have high resolution data then an heat map is not the only available solution. Take for example this low-res map: ...


4

Instead of cluttering your map by trying to layer your data sets directly on the map, why not try the reverse approach and abstract your data/images from your map, and give user the option to compare on the map directly. As a really rough example, something like this?


4

The user journey map shows the screens the user interacts with, in chronological order. It may also include the user's thoughts, emotions, or choice points. Even if your personas go through similar sequences of steps in the app, there should be some important differences between their experiences. Therefore, you'd want a separate map for each one (though you ...


4

It's best to follow current standards for mapping. That means, in this case, setting a start and end point by either dragging flags into place or tapping on the location while dragging to move the map. Most (if not all) map apps, ie Google maps, Apple maps, Waze, Bing, and more follow this behavior. At the risk of sounding like you should take the safe ...


4

Could this confuse the user ? Will he start looking for other places on this map ? Expect him to look for other places, but he will also likely be expecting not to find them. Usually this means he'll zoom out/drag a bit and then having done so, either get out of the map or stop looking altogether. Try provide an easy way to 'get back to where the ...


3

Yes, limiting the number of results on the map will simplify the map, however... ...it creates a bias that could influence your user in either a positive or negative way. There are a lot of factors that go into this though and there are two tracks of people I can see when using this map (Explorers and Beeliners). Explorers are going to go around the map, ...


3

Most of the digital design we see today is a replica of real life objects. We started with skeuomorphic design and slowly transit to simpler flat design to cut away the design bloats. Before the digital drop pin, people were using real pins to mark location on the map. There is no official statistics (not that I know of) on which location marker fare ...


2

You would want to use multi-variate map to display the same and you don't necessarily need to use colors to define all attributes as you can use symbols also or a combination of both. Here is an example of a bivariate map... This is also useful: http://indiemapper.com/app/learnmore.php?l=multivariate


2

Let me answer some of your questions and then I'll talk about some pitfalls with an example. Could this confuse the user? Will he start looking for other places on this map? A map widget will not confuse a user. It will offer more clarity to the user on how to find your shop, look for things to do near your shop and other local facilities and ...


2

Not bored, but overwhelmed. The more colors that are on your map the harder it will be for your user to differentiate what the colors define. If you take your current map, your user has 3(ish) colors to decipher. Red for a large cluster of items, an orange-yellowish for a medium size of clusters, and a green for a small number of clusters. This is a good ...


2

I visited the site. http://thebambergergroup.com/ A few suggestions: Make the map 'draggable' via click+hold+drag. Also, make it "zoomable" via scroll-wheel mouse. Create map load sequence - On a clean canvas, load the buildings FIRST. Then load the map underneath. This way, people know immediately that houses are not baked onto the map and potentially ...


2

Are there any recommendations on best usability practices for an animated map with isometric projections of buildings? From a cartographic perspective, you should follow the same guidelines as working on a regular web map. From what I can tell, you have most of them. I would consider a few things though: Zoom and Pan This is something that while it ...


2

A map pin denotes a location, it doesn't give you info about what that location is in order for the user to make the decision that "Yes, I'm interested in this location". So something like this may make sense download bmml source – Wireframes created with Balsamiq Mockups When user clicks/taps on the pin, display a popover with details about ...


2

This image will give you a better match! d.school 5 stages is just a subset of the all stages of IDEO 3 phases inspiration, ideation, implementation. In the image, the phases Observe and Imperatifs stages are the equivalent of the Empathize and Define new names used by d.school. The source of the image is from a french "inspiration" of d.school ...


2

If you use a rating for your locations as well, I would go for a heart as favourite icon. Stars are usually used for a rating like 3 out of 5. I've never seen this with hearts. Otherwise star and heart just have a different tone as Vincent already said.


2

Here's what I've gone with so far: I decided to go with a legend, clearly signifying which dataset is which and allowing users to toggle them on or off at will. I've done some pretty simple usability testing so far and the results are looking positive, but I'm sure there is room for improvement.


2

Good UI layout will remain the same whether it's in dark or light. Therefore, research into good UI practices will serve you well, regardless of the light you're in. However, to help you out, the difference in how the user sees good UI in bright light would be in contrast of colors. Generally in lighter conditions, colors will appear more washed out and ...


2

Did you take a look at how Google maps shows their shortest path? The shortest path is highlighted with a strong color and the other options in a less prominent color (grey on Google maps). Also an indicator shows how long each path will take to reach the destination. When adding colors just make sure you choose colors and a thickness that will make ...


1

I totally understand your dilemma. Despite the UX challenges, info on hover is an intuitive, expected, and convenient UI for the user. As long as it doesn't break ;-) Use a slight delay before triggering the info (200-300ms). If things are moving so quickly that this isn't feasible, then neither is the hover box. Once activated, the hover box should remain ...


1

First Two Options are Untenable First option implements there could be minimal time for the user to read, which you have no control over. Even worse, (s)he would need to move the cursor to display the data properly. The second option is bad because of inconsistency. Moreover the mousemove event triggers way to often. Conceptional Problem and Solution I ...


1

Interesting problem. Since you are using a tooltip, I am assuming that there is no need to have multiple tooltips visible simultaneously. If this is needed, a tooltip is not the right control. So my answers concentrates on not having the requirement of multiple tooltips at once. I was asking myself: why would a user want to see this popup? Probably ...


1

A few changes to my answer in light of the OP's clarifications; they would like a light weight tooltip to give information at a glance and this tooltip would remain at the cursor. The tooltip is showing two types of information. Set of objectsSome additional data with respect to an object Static objects by definition will not move, so showing the set of ...


1

What's wrong with using a dropdown menu? Anyway, I would use colors and an icon to indicate what the current budget is, in the place of where currently the blue text says "budget". With the default being set to just "budget", and offering up alternatives like savings account, government grants, sales income. Example: Functionally it'd work like a radio ...


1

You might find that getting the zoom level for the map is awkward depending on how dense the streets of the town or city are, so would be good to let the user change this (pinch to zoom etc). However it could be solved just by showing a interactive map with just that pin on it if the user taps the map. Another small thing is handling how the user might get ...


1

You should look at (Google's) inbox for touch screen implementation of hover. There are a lot of hover control in inbox. You hover over the icon, they turn into checkboxes, you hover over title, more option button shows, etc etc... In short, they replace hover with one touch (tap), and replace click with two touch (two taps). I'm replicating this ...



Only top voted, non community-wiki answers of a minimum length are eligible