Tag Info

New answers tagged

11

Here are 3 ways to accomplish a high-precision, trace-style outline without the fat-finger effect. Approach 1: Similar to Kit Grose's excellent answer. A mask gets applied, and you can use brush and eraser to adjust the boundary. The only difference here is, if you need to see the detailed interior of the wound, then the mask works in reverse, i.e. the ...


3

You can use an offset pointer/cross-hairs above the center of the touchpoint with an appropriate width. This will make allow you to see where the line is being drawn, not being obscured by your finger or hand.


12

I would flip the problem on its head: instead of tracing around the wound, have the user paint a colour over the wound. Give them two tools; a paintbrush and an eraser. This behaviour is similar to the Quick Mask mode in Photoshop and it works great because you can use a very large brush size at first and then come at the sides with a large eraser to ...


1

It is completely subjective and you will find very different contrasting opinions on here. So here's mine: In the right place they can be productive and add to the content. In particular it is a good way of prioritizing your content. For example, you've worked on 4 projects lets say and you want to show screen shots of all of them in multiple states. You ...


0

I would suggest to use carousel. PROS Works on all platforms Supports mobile gestures CONS Not every user knows how to use carousel Auto-scrolling carousels are bad For more detailed information check: http://uxmovement.com/navigation/why-users-arent-clicking-your-home-page-carousel/


0

To make it clear that there is some kind of scrolling/paging functionality, it is helpful, to indicate via truncated content (which shows the direction where the full content is) or via visual representations (carousel, scrollbar). Have a look at the attached screenshots of some examples:


1

I will suggest to grid the events with columns for technology and department, to sort/filter by.


0

This is a complicated question that touches on several important issues. I will attempt to answer by focusing on two core issues. Do you see a use for someone to come in, like myself, on a freelance basis to prototype motion in AE? What other tools do you find beneficial for this? Absolutely. There is a large demand for freelancers to provide ...


0

I used to work in a firm where they really tried to encourage the use of animation in user interfaces. Their belief was that animation should be defined roughly at the very earliest stages of prototyping. Hence, it was the duty of the UX people to enhance their wire-frames with animations. So when they searched for a tool that even UX people with no ...


2

It'll be hard to suggest how to consolidate two interfaces without seeing them first. Your question is a bit more of action consolidation - to which the answer is yes, this is possible: You can provide a two column view, one for users one for groups, multi-select list in each, and allow drag & drop between them, both ways. Something similar to this ...


2

This is a well known design pattern. You have a form which contains sub-workflows, which can be fired off at different times in different orders. Problems: Legends (asterisks in your case) should be avoided if possible, because it forces the user to dart around the screen to figure out which controls are asterisked. Having the action buttons in a ...


1

Color-coding the data entry boxes will give additional affordance. Are there other visual representations of the two actions (A and B) that might be represented with an icon or symbol? Can you logically group the required fields for each action?


1

In it's simplest form the idea 'progressive data capture' is that you only ask the user for the data you need when you need it. The problem it solves is form abandonment - the more you ask your users is a single go, the more they are likely to give up and go away. I have done some work on an offers site and used this method to capture data from the users: ...


0

Personally, I prefer the method used in the Google Chrome settings pages of Apple's control panels: Each time any control is changed, switch is toggled, field completed, etc the new state is stored automatically as soon as the state for that particular input is changed. However, when I am wary of the changes I am making (if it's something difficult, ...


0

I would posit that the problem is annoyance to the other people around the person clicking the pen. Assuming that in all other regards the pen meets the purchaser's needs and wants, what about the pen isn't taking away from the quality of the experience? Based on the scenarios described by OP, the annoying clicking sound. Just like Mercedes Benz engineers ...


5

If you want a logical way to display it, I'll go trough that And by the way, care about typo size if you go responsive, that's quite low here.


0

I agree with you. You asked for an argument to help support your case, and the UX rationale would be: Typically, help is not someplace you want to direct users. If the site is reasonably designed, then most users will know how to use the site and you want to focus user attention on actually using the site rather than finding help. Only a minority of users ...


3

There's more than one type of mechanism for retractable pens. As others have said, besides the click-open, click-closed mechanism, there are ones with an end button to open and a side button to close. I have seen some pens (mainly high-end metal body, Parker I think) that are opened and closed by a screw mechanism: about 1/2 turn clockwise to open (shorten) ...


5

1. Keep what works and has stood the test of time The current mechanism for extending and retracting a pen is super easy to use. It's so easy, in fact, that some people extend and retract their pen repeatedly without even thinking about it. Most people don't do this. We shouldn't alter a familiar thing in order to prevent a certain behavior by just a few. ...


2

Make the pen button very sharp so there is a cost in pain or discomfort in clicking the pen. While some people might still habitually click the button (especially once their thumb is safely wrapped in band-aids) at least there would be quiet while they were looking for the first aid kit. Also, it would be convenient if your business consists of a lot of ...


2

Click-ability and its side-effects The habit of clicking on a retractable pen is just a evidence that the design of the retractable pen was done with affordance in mind. However this has had some side-effects where users will hijack a specific affordance to satsify conscious or a subconscious needs which results in the habitual pen clicking behavior: ...


6

I have seen pens where the user must press the top to reveal the nib but to retract it again they must release a latch on the side. This certainly makes the process of habitual clicking slower. My solution would be to rethink the model entirely - I have used pens in the past that operate on a twist mechanism which is entirely silent but still offers a ...


37

I think the first thing to do is to break down your premise that they are doing it "for no reason." You are correct that clicking the pen does not engage the pen in its role as a writing implement. But if so many people are doing it (this writer included) it must serve some purpose to them. The Wikipedia article you link to includes a list of causes of ...


1

In the guideline they define chrome Do more with less This principle limits your app to its core functions and no more. Think content, not chrome. Content takes many forms: pictures, emails, news articles, and so on. Remove chrome to leave only the most relevant elements on-screen. And, make navigation elements from the content itself where you can. Let ...


0

I think you could have better use of space and the screen would not have to jump You don't need that much space for years Only have the years visible if Fixed is checked and years text in gray so it looks like an instruction As for screen jumping have years toggle from visible to hidden (not collapsed) Different languages use different verbs but hidden ...


1

Redesign the connector The obvious, answer if you had the option would be to design the plug so that either: the orientation doesn't matter it's clear which orientation must be used Modify the housing If this isn't an option, the next best thing would be to make a modified cover which forces a given alignment. This is could be done by selecting an ...


6

Per Nielsen Norman: Chrome is the visual design elements that give users information about or commands to operate on the screen's content (as opposed to being part of that content). These design elements are provided by the underlying system — whether it be an operating system, a website, or an application — and surround the user's data. What ...


6

If you are showing all fields at once, grouping them in a way to show relationships is important. Don't forget to disable items that are not relevant given the current selection, and be sure that your input fields have units (i.e., "years"). download bmml source – Wireframes created with Balsamiq Mockups You can compact the form a bit, if it is ...


0

I am programmer learning a bit of UX so I may get beat up by UX purest but I capture metrics on user productivity. If a top performing user asks for a tweak I will take that over a low performing user. I am in an environment where contract data entry use more than one product. Too often a low performing user will state the (my) product is the problem. I ...


3

Ran into similar situation in the past. We ended up solving it with a vertical form design and placing the fields this way: download bmml source – Wireframes created with Balsamiq Mockups Vertical forms are the fastest to process if you're doing strict data entry. So if it's possible to redesign the form structure that might work. If not, ...


1

A general rule of forms is "keep them as short as possible". I think the first one works best for that, the only problem you would have is if there are too many radio buttons, in that case when there are too many (whenever you feel radio buttons lose their advantages) change to a dropdown. Also, a nice animation helps to make sense of it. And you also ...


2

Last option with the checkbox is the cleanest. However, you can also drop it and just leave the input control with the guidance text to skip the field if the contract is open. download bmml source – Wireframes created with Balsamiq Mockups


0

User Experience isn't about taking exclusive decisions, is about make the overall experience for the majority of users, the best as possible. I will use your use case as an example. Previous version Single text field, coordinates separated by comma. Advantages: copy/paste is smooth Disadvantages: readability New version Two text fields, one per ...


15

You can't please everyone Most changes or additions will leave some people behind. They may catch up later, they may hate you forever. Shoot for net gain in the experience. If you avoid negative feedback, you avoid progress. It helps to keep a destination in your sights. Focus on an established list of goals for the long term vision of the product and the ...


21

Try to distinguish between what users want and how they want it done. Taking your example above, users wanting one vs. two input boxes is all about the how. The what is being able to paste comma-separated coordinate pairs vs. not having to press comma. (Or, for some users, being able to simply press comma rather than having to click a second input box.) In ...


3

Accommodate both! In this case, your users told you exactly what they were missing in the old version (in this example, easy copy/paste). So create a new way that meets both sets of requirements. Generally speaking, say the old way offered Features A and B, and the new way still supported Feature B, lost feature A, but added feature C. Users said they ...


21

I've seen chevrons become popular for things like this. Big fat areas that are easy to press, along side footers with an ellipse. Pretty familiar symbols that imply expandable content without having to read.


0

Spell it out with "show more" or other text as indicated by another answer. For a page with many items I find it starts looking cluttered to say that on every item and is not very elegant. It gets the job done though. Add an indicator for more such as a "+", down arrow or "..." at the end of the last line. Show the first lines of the additional content ...


0

A third way would be to have part of an image or the top half of some text at the bottom of the card, so the user sees there is more information on the card.


2

The below would work (plus sign could be moved to right or left to the content). Moreover, you mentioned the list as "cards" so if you want to trigger the expand/collapse on the touch of the entire card, this will be prominent enough. Code pen below http://codepen.io/pdjarratt/full/miswr/


2

I've voted up DaveAlger's post because I think it's the most straightforward and it's clear. I thought I'd mention an idea I had whilst considering this. It appears from the proportions of your mock up that it's a phone/touch application. I had an imagine of a zip horizontally on each card that allowed dragging the fastener across to open the zip and reveal ...


14

"show more" link (near the bottom) The easiest and clearest way to do this is with a clearly labeled link... show more If the link is there then I know there is stuff not showing. "expand card / collapse card" link (in the upper right corner) If you think your users will want to both show and hide the additional content then make sure the link to do ...


0

Maybe something like a thermometer? If your number is low, then it's blue and you're cool. If the number increases, then the size of the vertical bar increases and gets yellow, orange and red, grabbing more of your attention. The way you put things reminds me of gamification. If it wasn't numbers but faults, you could also use the concept of lifes (like ...


0

Keep the target simple I've worked on something similar and came to the conclusion that it's best to take a simple dashboard approach. Don't get the user caught up in the semantics of "am I moving up, or down, or sideways ... ?" Here's an example for a call time metric where the user (a phone agent) is trying to hit a management defined target. That target ...


1

Just look at how weight loss apps are doing it - usually using a line graph where the target area is marked:


2

Two suggestions: I would show the "Selected Group Title" and "Detailtext" as a tooltip/popover in the chart and change the background color of the selected group element (much more visible than indenting) This way you have all your information in one place (the chart) and don't need to look at different places fot the title, description, percentages, ... ...


0

You can still represent a goal going in a "negative" direction in a "positive" way for the user. Let's look at one the real world cases you raised: Have an average call time of less than 10 minutes You could display the user's running average of call times and designate "zones" of progress. For example, if a user's running average is less than 10 ...


0

I would call those 3 targets and put them exactly in the middle of the progress bar It they are over the target the bar starts in the middle and goes to the right in red If they are under the target then the bar goes to the left and is green


1

There is the philosophical notion and then there is how the roles differ in the job market. Web Design concerns the look in feel of the website as far as Marketing and Branding and browser standards. Interaction Design concerns the user behaviors and actions during a user flow of an interface (ie: How the widget works, how it slides up or overlays, drops ...


0

Without more details: 2nd way. Because you have two different interaction types. Selection of category Drag & drop between available & selected You might also consider to add keyboard support (e.g. buttons to move items between the lists). How does the user know that items can be put in the second list? Is it obvious by the data?



Top 50 recent answers are included