UI DESIGN PROCESS_____

This mini-class is a practical summary of the work that lays behind the ‘fast and easy’ aka user centered designs. I aim to describe a way to develop a futureproof UI design process that uses the elements and principles of design systematically.

UI Design Process - Practical Design Guideline Preview

INTRODUCTION_____

During the 6 sessions of this mini-class, I’m going to correct, style and replace the elements in the sample UI group by group, layer by layer. The UI design principles applied along the way come from the field of behavioral psychology and material design (referral links provided in the transcripts), intentionally avoiding industry-specific alterations.


By the end of this mini-class, I hope the readers will have obtained the understanding of how to engineer an interface that communicates its functions clearly and leading users naturally and silently through the platform.

6 design sessions
Visual examples
Reference links
Audio transcript

MATERIAL_____

I’ve made the sample UI downloadable below, and encourage readers to repeat the corrections using their own design decisions in order to practice systematic approach and develop their own design process.

 

I’ve made the sample UI downloadable below, and encourage readers to repeat the corrections using their own design decisions in order to practice systematic approach and develop their own design process.

SAMPLE UI (PSD)_____

Sample UI for the UI Design Process mini-class

COMPLETED PREVIEW (JPG)_____

UI Design Process Preview | The Elements and Principles of Design

CLASS HISTORY_____

As a digital design strategist, I’ve been working on applications and web platform, mentoring the design work for quite some time now. I’ve often made a note for myself along the way when I noticed certain areas causing difficulties. From this list, an interesting pattern emerged. The pattern showed me that the reason behind most of the confusion, both on the user’s side and on the designer’s side, is that the intended visual has been applied without employing a futureproof ui design process.


I’ve created this mini-class to pull together the elements and principles of design that form the intuitive interface. Also, to describe how to manage a large-scale project without losing the coherence between the elements of design.

In order to demonstrate this systematic UI design process, I first grouped the elements of design – the most common visual tools used to communicate in the interface - into six groups based on their role. I also prepared a demo interface suffering from numerous flaws. That demo interface is where I’m going to put the elements using systematic approach, explaining the original problems and offering new ways of solving it that take the human conditions into consideration. In most cases, I have provided a link to the exact psychological or material design principle I’m referring to during the correction.