Some weeks ago I co-hosted a Visual Storytelling 101 workshop with my visual thinker friend Yuri Malishenko at the Design Summit 2020 conference. In this article, I share the sketches I created during our workshops, and I also list out some tips & what made our workshop special.

Some weeks ago we held a webinar called “Neobanks X-rayed: a UX/UI audit & zoom-in to the challenger sector with a special focus on Revolut’s strategy” together with two great professionals, Feri Muck and Ivan Muck. We examined Revolut through three lenses: business strategy, UX design and UI design. One…

UX Knowledge Piece Sketch #43 — What is the Aesthetic-Usability Effect? A definition by the Nielsen Norman Group: “The aesthetic-usability effect refers to users’ tendency to perceive attractive products as more usable.” “Users are more tolerant of minor usability issues when they find an interface visually appealing.” As you will see, there is room for additional research in this area of…

And what to focus on instead (analogies and idioms) — Metaphors on a UI Using a metaphor is about referring to something by utilizing a word / expression / visual cue that is not literally applicable, but represents certain attributes of it. Next to similarities, there’ll be inevitable mismatches, so from a UX point of view it is important to think about discoverability, too…

Alignment basics Types Aligning elements on your UI creates an underlying invisible structure — when two elements are aligned, their edges or center lines follow a common position. Edge alignment: left, right, top, bottom Central alignment: horizontal (you align the horizontal centers along a vertical line) and vertical (you align the vertical centers…

Good defaults in UX design A default is a ready-made decision for your users. You preselect values, settings or preferences for the user. As a result, you can avoid decision fatigue and reduce cognitive load. Next to these benefits, adding good defaults might result in a better user experience by reducing interaction cost, e.g. if…

Whitespace — The basics Whitespace is the empty space between (or inside or around) design elements, e.g. between an image and textual elements, between two lines of text or two letters. Its synonym is negative space. Whitespace is not necessarily white, it can be any color (or texture). …

Eye tracking Some basics Eye tracking is a sensory technology that shows what users are looking at: fixation points: what the use focuses on saccades: eye movement between fixations order, duration & counts; returning to an element An eye tracking pattern is a certain way users follow content on a page Visualizations for eye tracking Gaze plot: the…

How users read online? According to the Nielsen Norman Group’s research (both from 1997 and 2020), people don’t read, most of the times they scan through pages. And usually they don’t skim through the whole page, they cover only portions of it, and they do this in a non-linear fashion. However, users do read…