Sunday, June 30, 2013

Hidden Design Elements

There are many design elements to consider while creating iOS apps. Some of these elements your users can notice visually. And some of these elements are hidden which users will notice while experiencing the app. 

Elements that users see

There are aspects of design that your users can see. They exists on the screen. They can see them and they can interact with some of them. These aspects differ for different types of app. 

Users will look at how components are laid out on the screen. They will notice the choice of UI component. Text on the app conveys information. Users will notice its readability. It needs to be easy to read for your demographics. Graphics styles your app. Creative assets needs to align with the purpose of the app. Most essentially it needs to connect with your user. Users will notice if it doesn’t.


Elements that users notice

There are aspects of design that user won’t see. But they will notice their absence. Here are some of these hidden design elements. (This is by no means an exhaustive list) 


Consistency

Consistency reinforces designs’ purpose. It reinforces behavior. It makes it easy for the user to remember actions they want to perform. It makes interaction obvious.  

Consistent use of UI component. Decide which UI components best serve the purpose for a specific action in UI. Stick with same component throughout the app for similar usage pattern. For example, if app displays user agreements, privacy policy in which user has to agree, use similar controls for accept/decline, use similar controls to display agreement text. 

Consistent use of navigational flow. It is essential to determine patterns for navigational flow. Define navigational pattern used for sub flows within apps and stick to it consistently. If it is drill down navigation, provide consistent controls to go further or go back. Reinforce next/back actions by providing them in specific place on the screen. If popover window slides up, make sure similar transition is applied to screens following same action.

There could be exceptions to consistency. Define why exception is required and use it sparingly and judiciously. 


Simplicity

Complexity within the app points to job half done. Take time to simplify. 

Simplify complex UI. If a single screen is doing more than one primary function, simplify the screen. Limit the number of popovers from single screen. Avoid gestures that are not optimum for certain screen sizes. For example, three/four finger gestures aren’t well suited for smaller screen. Screen has a functional need to display too much data, find a way to display information in simple manner.

Simplify any complex navigation flows. Find simpler organization for screens where wizards have too many steps. Avoid deep drill downs where users can’t track their way backwards. Keep navigational flow linear, don’t branch and re-branch off into sub flows. If that is functional need abstract that complexity out from user.  

Simplify configuration options. Provide a quick way to start using the app. Users rely on app designer to prepare the optimum default configuration for the app. If app requires too many steps to start using the app, users will balk in the setup process. 

Responsiveness

Responsiveness of UI is of utmost importance. Make sure that UI actions are not starving for resources against other time consuming operations. Move those non-UI time consuming operations to background queues. Transitions are required to be smooth. Slides and swooshes of UI elements provides context to subconscious mind. If they get slow or waiting to load data, its effectiveness is reduced and purpose unachieved. 


Visual Cues 

Use visual cues effectively. Effective use visual cues to make user aware of hidden gestures. Gestures like swipe for split views and page controls are not easily obvious to certain users. Use visual cues like bounce to make user aware of such available interactions. 

Use Transitions appropriately. Use transitions correctly to display additional screens. If popovers or modal windows are sliding up it makes sense if they slide down when dismissed. Avoid transitions from all edges the screen. 

Information Presentation

Present information user wants to know at correct level. Present it at level which is most logical. Present it at too high level and user will have to navigate deeper to get the information they need. Present it too detail and users will get overwhelmed by information. 

Finally remember this. Users will notice when hidden design elements are missing. 

No comments: