Five essential elements for outstanding UI design
Inspired by mentoring a university work experience student, Brett Mazoch — UI designer of health technology company Epro — shares his insights into the vital elements of creating user interfaces that positively impact user experience.
A few months ago I was asked to share my design expertise with a graphic design student who was invited to gain some experience in a development environment here at Epro. It was a great opportunity for her to get to know what it takes to be a User Interface (UI) Designer in a software company.
I started thinking about the most useful advice I would share with a budding UI designer at the beginning of her or his path. I immediately thought about design consistency, design workflow, team communication and several others – the most valuable things I have learnt or sharpened during my first year at Epro.
So I compiled my top five essential elements that every UI designer should have or develop to become a success. These tips will be especially useful for a designer who is working in-house and closely with developers and a product manager, such is in my case.
1. Solving problems with design workflow
“Develop your own design workflow supported by a set of design tools”
The design is a process. It is the process of solving problems. And such a process involves thinking and decisions. As designers, we are here to support that with our design workflow and the tools we use. The goal is to get solutions designed smoothly, quickly enough and based on a research and requirements.
For example, my design workflow includes sketching ideas on a blank paper, asking additional questions, creating digital wireframes, transforming them into hi-fidelity designs in Sketch and preparing outputs with annotated specifications for developers.
2. Keep design consistent for usability
“Keep UI consistent by creating, managing and using a style guide”
The consistency is, in my opinion, one of the key elements of very usable and successful products. And the main tool for keeping the consistency across the user interface is the style guide for UI elements, design patterns and interactions.
At Epro, the style guide is my (the designer’s) and developers’ reference place. The great thing about the style guide is also that I can use it as a support for a communication with stakeholders. Thanks to that I can link my design decisions to previously defined rules and principles.
3. Effective sources management saves precious time
“Challenge yourself for well-organised files and graphics assets”
During a busy design project, I can end up with a lot of design variations at different stages of punctuality (lo-fidelity vs hi-fidelity vs specification). All of this for every new feature or functionality to develop. As you can imagine it is necessary to properly manage a large amount of source folders, files and graphics assets. And the same applies for individual graphic source files because inside them I have to handle artboards, layers and all representations of UI elements.
To keep all design files manageable and quickly searchable, I would advise you to define a good structure and naming rules for all design sources and assets.
4. Team communication
“Communicate and describe design outputs clearly and precisely”
The work is never finished with an export of the final outputs. Not yet, anyway. The outputs need to be communicated to developers and then, the implementation should be continuously supervised in terms of visual and usability acceptance. The precision of the communication between developers and designers influences the implemented result.
For example, rather than sending developers just a static image with designs, I usually create specifications and annotated flow diagrams (UI storyboards) for the main user path and for special use cases. These flow diagrams are fantastic for a higher view of the design and can be complemented with clickable prototypes. On top of that, I am always open to discuss designs in person if something needs clarifying.
5. UI designers need to do more than just design
“Keep developing and improving your non-design skill set”
It is important for UI designers to have more than just graphic design skills. The challenge is, for example, to communicate, present and defend our ideas whilst developing empathy with users, business stakeholders and developers at the same time. In short, designers need to develop soft skills and knowledge about human psychology to build relationships.
One advantage for work in the software industry is having experience with programming and modern technologies, not solely design. I studied computer science and was involved in programming tasks during my whole career (using HTML, CSS, JavaScript, C#). Even though I am focused mainly on design, learning programming and coding in the past was definitely very useful for my current career. It gave me a broader view of software development and I can use it to be even better designer.
Final thoughts
Since moving to England in 2015 from Czech Republic, I quickly needed to learn a bunch of new skills and get used to a development flow in an agile environment of a hi-tech software company such as Epro. These five essential elements are truly the most valuable things I’ve learnt or sharpened so far. They represent my experience which I am always keen to share with other designers at the beginning of their career paths. Being a UI designer is rewarding, but it is not only about drawing nice images. Being a designer involves learning several other skills as a complement to the craft of design and be ready to overcome various challenges.