Loading...

UBUNTU PLATFORM PRODUCT UI/UX DESIGN

Canonical were in the starting process of building a new mobile and tablet for Ubuntu’s operating system. I was brought in to help work on the  visual design & motion Interaction design for the platform and applications teams.

Working on the production of the mobile and tablet operating system the platform was an essential part of the OS. One of the main standout features for the platform design was the interaction with the four edges of the device. The edges allow the user to use the main features of the OS with a simple swipe. Below you can see an overview walkthrough video to showcase the full features of edge interactions on the phone device to get a better understanding. Also keep scrolling down and you can see more

RIGHT EDGE DESIGN

The right edge design was one of the key features for tablet and mobile. It allows the user to switch applications quickly and easily. Below I have showcased the implemented design and how it works.

RIGHT EDGE UI VISUAL DESIGN FOR MOBILE & TABLET

RIGHT EDGE VISUAL USER INTERFACE DESIGN FOR THE PHONE AND DESKTOP

APP SWITCHING UX INTERACTION DESIGN TABLET AND PHONE

Below I have shown a UX motion interaction walkthrough video which showcases how the right edge functions on the tablet and phone. The right edge functionality became especially challenging when creating for tablet as there was the ability to use 2 working applications at the same time (referred to as the side stage and main stage) this was challenging as there was alot of thought into how to get to the main app switching mode.

One of the main use cases involved allowed the user to do a short swipe on the right of the phone to switch between the previous applications quickly. This became quite challenging when the thought process was brought to the tablet. I had to present this to the founder of Ubuntu during a design sprint to visually show how the right edge would function

TOP EDGE SWIPE (INDICATOR MENU DROP DOWN)

‘The phone top edge swipe’ which was showcased in the video above was initially a drop down menu to reveal the phones notifications menu. However the way this had been improved on was by allowing the user to get feedback on more options by tapping and holding swiping right and left to browse the different functions possible i.e notification menu, rotational abilities, file downloads and location details which they can then  select.

Below you can see the visuals created and an interaction video to see how this works when built on the phone.

PHONE OS BOTTOM EDGE

the ‘bottom edge swipe’ on the phone allows the user to add favourite content, re-arrange the content and to delete what shows on the phones main home page.

Below I have shown the stills and in the video what happens with the user swipes from the bottom edge of the phone.



 Previous  All works Next