UI Design
We create the project’s visual style by drawing unique screens, elements and prototyping animation. If needed, we create a digital brandbook, which forms the basis for designing future products, webpages and interface elements.
Visual Concept
Initially, several internal meetings are conducted with an art director during which modular grid, style of elements, colours, accordance to the current visual image, etc. are determined.
As the result of these meetings, a thorough and well thought-out design concept of several core pages of the system begins to form. The result of the completed work is reflected in the PDF presentation which explains all of the design choices.
UI-kit formation
For large-scale projects we form a united set of elements that are used further on in the project. Buttons, forms, sortings, tables, text blocks, a variety of states of the elements during interactions etc. This allows us to maintain a single style of elements while working on the interface.
The elements may be presented as a graphical Photoshop or Sketch file; alternatively, as a library of components merged in HTML.
Rendering unique screens
Typically, interface consists of few main unique screens and multiple repeating ones, in which only the content is subjected to change and not so much the design.
Amount of unique screens is specific to the project and depends on client’s personal approach. Often, client requires to see all the screens for the purposes of internal agreement and as a guidance for third-party developers.
Animation prototyping
Multiple elements in modern interfaces contain both micro and macro animations.
Micro animation are the element’s effects which appear when either a cursor is hovered over them or when a drop-down list is expanded, etc. Macro animation are global effects which are responsible for object appearance, exit of modal windows, etc.
Micro animation are the element’s effects which appear when either a cursor is hovered over them or when a drop-down list is expanded, etc. Macro animation are global effects which are responsible for object appearance, exit of modal windows, etc.
Correctly prototyped micro and macro animation system provides uniqueness and eliminates unexpected effects which otherwise could be encountered by user.
Digital Brandbook
Description of the principles of page and element formatting is included in the digital brand book. We form a so-called visual language that will serve as a foundation for the formalisation of future products, pages and interface elements.
It is especially necessary for developing companies where constant changes and updates are common and are often performed by more than one contractors.