Tag Info

Hot answers tagged

7

Edit: The answer has been accepted but I would like to clarify and improvise a few things here. First, as far as visual styles are concerned, it's better to call it realism as against skeuomorphic. Realism would be a pure visual style. Second, flat styles can be misused resulting in bad UX, which does not mean that all flat designs = bad UX. I agree that ...


5

Relying solely on mouseover isn't enough. You'll need to find a way to communicate to users that the div is clickable so they will point the mouse at it. The mouseover change will be helpful as a confirmation at that point. Look at how other sites accomplish this. A textual call to action will make your div look clickable. Or making it look like a link ...


4

If you don't find any guidelines (which I didn't) and the labels you need are widely used, you can take big sites as Google, Facebook, Twitter, Youtube as an example, just search for the Spanish version of this sites, they have neutral Spanish translations. I'm a native Spanish speaker so I can tell you some of the most used: User: Usuario / Nombre de ...


4

Although your interface is usable, it's important to utilize cohesiveness and decision-making in the case of image selection. By "toggle", I think your co-worker means the options should be more clear. Here are some mockups that might better illustrate what I mean: Drop Down This method is used heavily in social media, where the user intuitively clicks on ...


4

I don't think shadow on a button is old design if used elegantly and sparingly. You can see here in Googles Material Design they use "raised" buttons with shadow to show depth. https://www.google.com/design/spec/components/buttons.html#buttons-flat-raised-buttons


3

The calm/easy colors that normal convention dictates isn't just there because they are a bland and boring app, it it because those colors have been tried and tested to allow users to look at the screen and use the app long without eye irritation and usability issues. It is a trend now for entertainment focused apps to use more bold colors to attract users ...


3

The four Divs on your homepage could be treated as Cards. By popular convention, you can create an action panel underneath your card and include buttons or links for actions such as "more details" or "share". download bmml source – Wireframes created with Balsamiq Mockups


3

I would simply separate it a little bit from the group and put a subtle divider in between. White space is a powerful tool for grouping.


3

I think it varies with the amount of data you wish to display. Let's take line charts for example - if you have only one or two lines describing your data, I think it becomes relevant to see the grid (and does not cause much clutter) as it helps to see the reference values. e.g. Seeing that the blue line just went over the '50' line grid is pretty easy to ...


3

Immediately looking at your design there are no visual clues on draggable elements. The first thing I would do is add some sort of visual aid to these elements to guide the user You could even take this further by adding visual cues to the overall container However I do think the overall layout is the actual issue of confusion (unless I misunderstood ...


3

This has been widely discussed, you can take a look a this NNGroup related article, I will sum it up: Drawbacks of using no labels Disappearing placeholder text strains users’ short-term memory. Without labels, users cannot check their work before submitting a form. When error messages occur, people don’t know how to fix the problem. ...


2

It's a tough call. Typically I'd say it's better to use a label for the very reasons you outline - i.e. that the placeholder or watermark is transient and disappears as soon as you enter something else. In a recent survey of about 60 sign up forms on most popular English language websites, I found that: 26 used placeholders 27 did not use placeholders 6 ...


2

I work for a company that offers services for non profits to raise money, and we don't always show a thermometer (that's what we call it) to show how much money has been raised. It depends on the case. That said, the reasoning for using a thermometer is simple: show publicly how much out of the goal has been raised. This provides donors a clear ...


2

You mention "I think it will create cognitive load for the user" and then say you want buttons not to look like buttons.... I think you'll need to: a) specify a little: is this ONLY for desktops? are you ABSOLUTELY sure nobody will use a touch device to visit your site/app? And if not: how do you plan to do what you want on touch devices? b) use elements ...


2

I believe that what this really boils down to is that you are using the wrong control for the job. Most often when designing an interface, if you can't easily map an input to a certain control, it's not the correct control to be using. In this case while a slider might look more streamlined and attractive, you've noticed their limitation; They exist to ...


1

Which pendulum? We can not say that this is a pendulum between flat and skeuomorphic design.I would rather use another metaphor: Evolution. In Evolution, it is hard to see things goes backwards in general but there are also rare cases.Personally, I don't think that skeuomorphism will come back like as it is. Flat design is originated from minimalism idea ...


1

I like to imagine (hope/dream) that it is pendular, like this: Naturally, as with any swing, it will probably fly backwards towards Skeuomorphism again for a while - almost as a reaction to the problems the completely flat aesthetic has created. Over time I like to think it will come to rest around that perfect middle where users are catered for ...


1

That is pretty clunky as the information is repeated across the page. I'd suggest using something like the OptimalSort card sorting approach: drag and drop into groups, maybe create new groups.


1

• As Tomaz said, break down the form in simpler, logical steps; • Indicate the number of steps in the interface at all times; • Avoid sub-steps; • Use a single column for input, otherwise it might confuse users about what's optional and what's required (http://baymard.com/blog/avoid-multi-column-forms); • Each page should check for errors before ...


1

If you do decide to go with gridlines, you must consider a few issues: Screen size is important - lots of grid lines close together on a small screen will be far more confusing than helpful. Besides, if the screen is small enough (i.e. anything mobile) your users will probably be able to check easily against the relevant axis. Perhaps have a rule that ...


1

The basic functionality sounds to me like what would be in the physical world called a jog dial. There are two basic types of wheels. One type has no stops and can be spun the entire way around, because it is a relative rotary encoder. This type depends on tracking the actual motion of the dial: the faster it spins forward or back, the faster it ...


1

Definitely show it, the progress bar will work as a visual nudge to donate. Users will not expect it to display their contribution if the scale is for thousands.


1

https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/UIKitUICatalog/UIDatePicker.html http://developer.android.com/guide/topics/ui/controls/pickers.html They are just called date pickers in iOS guidelines. Android generally terms them Pickers for both date and time. These are just customizations of already existing ...


1

It's known as picker or spinner. First example looks like a custom designed one, but it can be done with this tutorial, your second example is the native iOS6 picker (now it has changed to a flat look)


1

As someone who recently finished designing an interface in which drag-and-drop was the primary method of accomplishing the task, I agree with the points that Jason and BatlaDanny made about clueing the user in on what they are supposed to do. Written instruction is great but, if possible, a transition animation would do wonders especially for those who don't ...


1

Jason has written a decent answer for emphasising dragging by adding visual cues which you should implement, but the problem is a more deeper than this. From your wireframes, I'm inferring that the interface is a website and not a mobile app. And on desktop interfaces, dragging, swiping and other gestures are not so obvious or intuitive and herein lies your ...


1

An opinion from the other side: Oh my word I love this behaviour. I have moved to a Mac for work and I miss it dearly. When you're working on or reading a document or webpage, you can grab the bar scroll up or down to check something, and then drop it again to continue from where you were. As has been said here already, it's about cancelling an operation ...



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