IXD101 – Introduction to UI Design [6]

On week six we looked at user interface principles such as User Interface, Human-Centred Design / User Experience Design.

 

User Interface (UI) design focuses on what users might need to do and ensuring that the interface has elements that are easy to access, understand and use to facilitate those actions. UI brings together concepts from interaction design, visual design, and information architecture.

  • Voice-controlled user interfaces allow us to interact with systems vocally while gesture-based interfaces let us engage with 3D spaces, opening up new possibilities in communication and allow people who are unable to interact with traditional interfaces the opportunity to lead more independent lives.

 

A design system is a collection of reusable components, guided by clear standards, that can be assembled to build a number of applications.

 

We were asked to use Material Design Systems created by Google to create a user interface card by using the design system’s guidelines in typography, spacing, sizing, margins, and padding. For these we chose our favourite song and artist, a small bit of information on the artist and a photo to assemble into a card. I chose to go for a simple colour scheme based off my photograph and used burgundy-red shades for my text and buttons as they were appealing and contrasted well with the white around.

When designing your interface, it is important to try to be consistent and predictable with your choice of interface elements. Whether they’re aware of it or not, users have become familiar with elements acting in a certain way, so choosing to adapt to these elements when appropriate will help with task completion, efficiency, and satisfaction. For example, the rectangular or circle use of shapes for buttons.

We were then asked to expand on our cards to present a collection of albums or tracks from our favourite artists. For this, I chose to make mine look like one of the songs were playing and highlighted this in a different colour to the rest with a symbol to indicate it was playing now. I found this task super fun and you could play around with it all day to see which colour schemes or layout is most modern and effective. I took some inspiration from Spotify and created my own version for this and found that the outcome does in fact look like an mp3 style player and I was really pleased with the outcome overall.

The UI card exercise helped us focus on tight guidelines which allowed us to understand how content – text, image, icons – can be presented in a clear and easily accessible manner and which layout is most effective. I thought it was interesting to see the basic impact of components such as buttons and how particular shapes or colours can be more appealing to others and can give a command without being too complex.

Leave a Reply