How We Do It And What It’s For
A website’s or app’s functionality, interaction design and its overall look and feel form the paradigm of what we call UI design. But there is one more field that helps UI designers go the extra mile in shaping apps and websites with memorable user experience - visual design. Armed with typography, illustrations and photography, as well as color, layouts, space and balance, our UI designers will wrap your content in an attractive and engaging cover.
- A comprehensive design language that is scalable for product or service growth.
- An up-to-date, neat and engaging design that is up to par with modern trends.
- An individual approach to the UI design that is developed according to the company’s needs and in line with the industry requirements.
- Streamlined user attention through user experience.
- A well-implemented UI design increases user engagement and retention rates.
- A project that is delivered in close collaboration among designers guarantees reduced time-to-market and effective delivery of a product or service.
- A well-planned approach to the UI design from the very beginning helps to avoid issues at the later development stages, lowering the development cost.
- An easy-to-use interface increases user appeal, helping them get acquainted with your product or service quickly.
How we create UI design
UI design creation starts with small research. During this stage we talk to the client to reveal their style preferences, we review direct and indirect competitors to find out the industry standards and research the latest design trends to make the system look modern for years.
Once the research is done, we choose the most complicated screen for creating a design language — the basement for the whole system. It is not only fonts, colors and styles, at this stage we create the core UI elements and lay the foundation for the UI kit (a library of all UI elements) that will be used through all the screens of the future system.
Since it's a core of the design we demand from the client feedback and make changes until we get perfect result. Only after we get explicit approval we can proceed with designing the rest of the screens.
Having a design language, UI kit, and a prototype we can create a design screen by screen
Design quality control
We measure design quality in three ways:
- Pixel-perfect. We double-check that all elements placed in the right place, colors and sizes are matches for the same elements through the entire system and each screen. The design is responsive and is good for each required screen resolution (desktop, mobile, tablet)
- Usability. As we said above, one of UI design is to streamline user attention in the right direction. So the design is checked by UX designers to make sure users can easily find needed information and controls.
- Implementable. After designs are done they all transfer to front-end development and it's very important to be sure that all design elements and modules can be implemented without problems.
So, the UI designers don't work in isolation — for creating perfect design they continuously keep in touch with the rest of the team.
Close collaboration with the client
Like at other stages, when we create a visual design we stay in very close collaboration with the client: gather requirements, listen to their ideas, and of course, present and discuss all key screens.
Design language we always present during the screen sharing sessions, so the client has a chance to ask questions and we have the opportunity to explain the key design decisions.
The rest of the screens we upload online so the client can review them and leave comments.
In this way, our clients always know that we move in the right direction and all the screens match their expectations.
What tools are used for the visual design
As we mentioned above, we continuously communicate with the client during the entire process, so it is very important to use good tools to make this communication as smooth and easy as possible.
For this we use one of these tools:
- InvisionApp. This tool allows us to present designs online as soon as it's ready and discuss them right on the spot.
- Figma. The same, our clickable prototype is online and we can leave comments anywhere in the pictures
- Zeplin. This specific tools we use to transfer entire screens and particular design assets to front-end developers which significantly reduce time of pre-development preparations
- Various tools for graphic design like Adobe Illustrator and Photoshop for creating custom illustrations and icons
We make visual design workable, pixel-perfect and modern. And the client is always in our design team