Tag Info

Hot answers tagged

20

I have conducted a study recently to ascertain whether a click menu or hover menu is more suitable for one of our larger financial client sites... these are my findings. I hope they are of some use or help to you: In summary: In general, hover menus are indeed expected behaviour on most sites, however it should be duly noted that on sites that are ...


13

There is no hover equivalent on iOS devices. The most conventional gesture to interact with content is 'tap'. You could have the content boxes open a pop-up or overlay on tap (which would work better on iPad than iPhone). Using other gestures which have no strong established convention could just confuse users. But it might just be more graceful and usable ...


9

Seems to me you need dropdowns like those below that open up on click not hover - with the down arrow acting as the affordance.


8

It's precisely because you only 'changed the layout' of your desktop app that your app seems cluttered and unusable on the tablet. It hasn't been designed for mobile - it was designed for desktop. The fact is you can't just change the layout of a desktop app and expect that to transistion suddenly to different type of device with a different set of ...


8

You have lots of questions here; this answer will include my suggestions for some of them. Add item should be an action (in the action bar) on the list. Edit, Delete, Attach Multimedia, and Break down item seem like they should be actions on the item itself, therefore should be shown as actions on the item detail screen. Long-pressing the item in the ...


8

Should i try and fit all this on one page (so people can view all questions on the form and decide whether to complete or not)? Sequencing The key UX principle behind this is often called Sequencing. It stands for the simple concept that: People are likely to be more motivated performing small tasks (rather than big). So you can increase ...


8

I would say a wizard 'stepped' process, with a progress tracker, is perfectly viable on a tablet. The full screen format should lend itself nicely to tapping through a form. Some related points to bear in mind keep amount of steps relatively low but… don't make each step too long clearly indicate on the progress tracker which step the user is on allow ...


7

Based on your image above, I would suggest something similar to the mockup below. For a pure mobile (smartphone) I personally believe that you need to reduce the number of images that a user might have to download only to help save on their initial bandwidth. For Tablet user I restored some of the images because of the screen size, it really helps to give ...


7

Starting your app with the side panel open is generally a bad idea. You will firstly create a poor first experience where you bombard people with all the choices in there rather than providing them with a meaningful first page focused on content. Secondly, if you simply show this, it doesn't let people know how it was opened in the first place. If they ...


7

I'm not sure usage heat maps are all that useful, as users tend to interact with the regions where the most important controls are - regardless if they are in the optimum location or not. There are some optimal thumb range heat maps in an article about thumb reachability for different sized iPhones. It might be used with tablets as well by mirroring the ...


6

download bmml source – Wireframes created with Balsamiq Mockups Two options I see, is to (A) move the back button up to the top right, where it is traditionally on a browser and iOS devices. This gives you room on the bottom to put the language option. Or (B) the language button could grow onto the logo bar, since it is more of a global setting ...


6

Maintaining your current design... As mentioned there isn't a hover behaviour equivalent on iOS devices. Even if you implemented a 'follow the finger' behaviour, most users will probably be moving their finger off the screen, moving to the target and then touching the screen again. One approach would be to have small page curls in the bottom corners. This ...


6

There are few aother things you could do without explicitly providing buttons. LukeW provides a great presentation about some techniques to expose gesture. Here are a few ideas: Expose parts of content Provide a hint Animate to temporarily expose additional content


6

Centered design, on top of each other both in landscape and portrait? Looks easy to use, but it really depends on context. I'm assuming the buttons are a group, and that's the basis of my design download bmml source – Wireframes created with Balsamiq Mockups


6

Start with the smallest form factor first (in your case the phone) since the lack of space will give you the opportunity to require you to define the primary focus of the app and what is the primary content that must be provided to allow the user to do his task and not allow you to add too much extraneous stuff. While moving up to higher form factors, ...


5

Your interface sounds fairly busy. Are you trying to take a pc interface and put it into a mobile or tablet version? If so, you should consider rethinking the interface by designing it as if there were no pc version.


5

I suggest you should use 'select+drag' approach instead. This is similar to 'double-tap-drag' described by PhonicUK but doesn't require immediate drag. User selects an item first by tapping it once, the item is then highlighted and ready for a drag operation. Other items won't accept drag until they are selected so scrolling is still available. I think ...


4

The Opera browser uses this icon for exactly that purpose: And of course with the corresponding one for close:


4

There is no single screen resolution for Android tablets. Although many current Honeycomb-based 10" tablet screens have a resolution of 1280x800, your application can also run on smaller screens (say, 7") and different resolutions and aspect ratios. And don't forget the portrait orientation. The solution is to design adaptive layouts. On the design side, ...


4

Yes, bright ambient light reduces contrast, so going with a black and white display will be the best you can do. Increasing font size and weight may also help. Hue differences also tend to wash out in bright light so your color codes are probably performing poorly anyway. Tinted sunglasses probably don’t help either. If the color codes are very important, ...


4

"Client explicitly asked for something connected to the world of agriculture" Perhaps you could argue the following simple metaphors: Touch to keep. To touch is akin to identifying with something, to form a bond, or to nurture or care for something. By using the word touch you are suggesting the user wants to keep the item. It's also the simplest ...


4

Implementing a wizard, or a stepped process should be no problem for tablets. Apps use this often in walkthroughs, and also registration/sign up processes, purchases and content creation. Walkthroughs These are essentially slides describing your app's functionality with a progress tracker to know what step you're on. Often accompanied with animations. You ...


4

You haven't gotten a satisfying answer because there is no satisfying answer. You are trying to make an application built with desktops in mind work well on a touch screen without changing your basic design, which is not possible. On a desktop, you have multiple ways to trigger actions on something (click and mouse over), while on a touch screen you ...


3

In addition to mere layout problems, i.e. having much information on the screen that comes with transferring an application on to a device with a compromised screen size it also depends on the application you're developing and which user interactive controls it utilizes. If the design pattern of an applications GUI heavily relies on desktop specific ...


3

In my opinion, yes. It is better to develop different UI for mobile/tablet. Imagine a 1000px width information to be read in mobile device. As a user you would want minimal scroll when you are using handheld devices. The desktop design is built for larger resolutions. Therefore it is not a good idea to squeeze the same design into a smaller resolution ...


3

For web pages, the reported screen/document size doesn't change when the on-screen keyboard is shown. So there is no way to adjust your design with Media Queries or JavaScript. If you want to adjust your page based on the on-screen keyboard opening, you would have to do it manually based on the field getting focus. With all the different possible screen ...


3

As stated, 'tap' is the typical interaction. If your goal is primarily to have this working on iOS, then I'd suggest a tap event and then use the card-flip style to show the text on the 'back' of the card. It's admittedly used a lot, but I'd say it's becoming a standard way to handle 'meta' information on elements on an iOS touch device. Alternatively, you ...


3

Single click (finger tap) is the most appropriate hover alternative on touch devices.


3

If said tablet is an iPad, there is an accessibility setting that toggles the display into a high contrast mode. It's not black and white, but it might let you test out a high contrast solution without having to make any changes right away. If you do decide to go with a high contrast solution, looking for screenshots of older monochrome applications can ...


3

Adding to Brian's comment, if the site is available for new users, you should definitely try to tell your client that if he is giving you the job he should trust your criteria. But it's better if you use information and examples to support your choice. I can think of three ways to deal with lots of navigation options that are immediately accessible (sort ...



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