The Touch screen Revolution and Its Impact on UX

  • 55 views
Uploaded on

The regular use of touchscreen means web design has to adapt. Designers must decide how they adapt their projects to suit users without mouse and keyboard access and although the development of …

The regular use of touchscreen means web design has to adapt. Designers must decide how they adapt their projects to suit users without mouse and keyboard access and although the development of separate mobile interfaces was the initial move, it’s now much more sensible to design responsively.

More in: Design , Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
55
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. The Touch screen Revolution and Its Impact on UX With Windows 8, Microsoft brought their desktop user interface in line with their Windows Phone – making the overall experience more intuitive for touchscreen users. Apple on the hand have slowly been making chances to OSX, with features shared between mobile and desktop operating features. A touchscreen Mac may not exist yet but the touchscreen revolution is definitely upon us. The regular use of touchscreen means web design has to adapt. Designers must decide how they adapt their projects to suit users without mouse and keyboard access and although the development of separate mobile interfaces was the initial move, it’s now much more sensible to design responsively.
  • 2. Mobile Focused or Responsive Design Many designers choose to create secondary websites or even apps specifically designed for touchscreen users. This gives the designer the chance to focus specifically on individual types of user in turn. One problem with a separate website is that a URL redirection is necessary and there’s more scope for error. The major problem however that the mobile version is a watered down version of the desktop website. Features are missing and options are reduced. This doesn’t have to be the case. Responsive design provides the same quality experience across all platforms.
  • 3. Design Differences The basic design differences between a touchscreen and desktop need to be understood. Touchscreens require an upward swipe to scroll down whilst on a desktop you manually scroll downwards. Buttons need to be designed bigger on mobile devices as tapping is less accurate than when clicking a mouse. Users will just be infuriated when they’re trying to press in too small an activation space. Mobile touchscreens also have no cursor so pinpointing is harder – further highlighting the need for larger ‘touchable’ areas.
  • 4. Screen Orientation and Aspect Ratio There is no standard screen size any more. The range of different screen sizes is vast and standardised resolutions are no longer clear cut. Mobile screens are even more complex with the ability to flip from portrait to landscape whilst in use. This issue is solved by liquid layouts. This type of layout self adjusts to any resolution or orientation. Liquid layouts can also be designed to change significantly when viewed via mobile devices to put control and user-friendliness at the heart of the design. Horizontal Scrolling The traditional scroll runs from top to bottom but Apple and the Amazon Kindle brought horizontal scrolling into the picture. It’s an essential element of many mobile apps and is the only way to mimic the true experience of reading a book via an e-reading device. Some sites may choose to add buttons to appear as if the action isn’t horizontal scrolling but switching between pages in reality it’s the same design element with just an additional button coded in.
  • 5. Which interface is right? Not every user interface is suitable for every type of website. Before starting any project web design professionals need to ask: • Who is the target audience? • What is being ‘sold’? • What impression does the client want to give? You also need to keep in mind the demographic of users. It’s not all 18-25 year old but it is more likely younger users will access the site via their mobile device. For an effective user interface you’ve got to offer your users simplicity. Big buttons may not be the most attractive idea but they are usually necessary for successful mobile design. Below are some key features of a successful mobile user interface.
  • 6. Radial Menus Using a radial or pie menu is a great example of intuitive design. It makes access to the inner pages needed much easier for mobile users who can easily get lost in endless submenus and drop-downs as common in desktop design. Skeuomorphism Meaning an element which resembles a real life thing (like the folders on your Desktop) skeuomorphism engenders familiarity. Familiarity adds further intuitiveness to any user interface. A successful design that incorporates skeuomorphism means that from a quick glance you’ll understand the purpose of the page. Minimalism Minimalism is one of the simplest and most effective ways of creating an intuitive and effective mobile-friendly design. Stripped back to just essential elements the message of website is key and it’s so sparse and simple that it’s easy to use via smaller screens. Flat design also comes under this umbrella and works on the assumption that intuition no longer matters. Interfaces and their uses are now so obvious and commonly used that a user interface no longer needs to guide the user, it can simply be a tool.
  • 7. Touchscreen technology cannot be ignored and the development and interest in flat and responsive design means it can be incorporated without too much separate work.