Logo Siclo
We shape Technology with Passion

UX/UI works just like a comic book story

time 5 mins

Why you should read comics to become a greater UXUI designer


When you read a comic book, you don’t have to think consciously about where to look. Your eyes (and brain) already know their way through the pages, where to start , what to scan first and where to go next. They follow a well known hierarchy: speech balloons belong to a panel and explain its content, multiple panels are separated by a white space called gutter and constitute a strip. When the narration is well done, you don’t have to think twice about the order in which you read it all, you instinctively know what to read and what to look at first. The reader easily navigates from page to page and rarely needs to go back to understand the story properly. This is due to the fact that the reader knows the codes of a comic book; he has been educated on the proper way to read a comic book (from left to right and from top to bottom unless you are reading a manga)


Composing a digital interface has a lot in common with drawing a comic: in both cases, the final objective is to empower the user (or reader) to go through product (websites or comics) without having to be explicitly told what to do. 


When the user wants to complete an action, he should intuitively know how to do it, just by looking at the website. The less a user has to think, the better the design is. Indeed, a designer has to guide his users the same way an illustrator does with his readers. 


When the designer wants users to interact with one particular element, he makes it stand out to be more visible - the best example of this is a Call To Action button, like “Add to basket” on shopping websites. Each piece of the design, ergonomy and the visuals of the interface are thought in order to influence the users’ choices so they can navigate in the application seamlessly,  the way they want.


This is why a designer also has to establish and follow a certain hierarchy when designing an interface - the same principle an illustrator follows for his comic books. To keep the example of a shopping website, when users look for a particular product, they first use the filter feature to reduce the choices, then browse through the categories to choose the right one and only then enter the details of the product they seek. A designer always progressively narrows the structure of the websites and applications he creates, because that is the most intuitive way to go: when you are designing something, you need to use what people already know.


This is why you have to be very careful when trying to be too original or disruptive when you create a digital interface; although it is possible to do so smartly, the risk is high: you have to keep in mind that your users already have mental patterns and habits they use to interact with their environment. For instance, they think of a door as something which revolves around a vertical axis, so they either push it or pull it open it. Sliding can also be appropriate if this is the right kind of doors (large, rectangular and transparent are good clues). The same thing goes for comic books and digital interfaces. Google, Apple, Windows and others have established important rules that one must respect to be understood and used by many users easily. If a designer tries to be “too new”, their work might not be used properly, and many users may give up on it early.


Another interesting trick of comics is how you influence your reader to keep her reading the comics, when she reaches the end of a double page and may be distracted: you make the last panel à cliffhanger. This is what makes the reader “addicted” to the story. This technique is also found in tv shows, at the end of each episode. Websites and applications such as Pinterest or Instagram also encourage their users to keep on scrolling indefinitely in order to discover a new publication or picture.


Therefore, you can see a similar pattern between the work of an author who has to guide the readers through the story plot, and the work of a designer who has to guide users through a website or an application. Arguably, the main difference is that the comic book follows a linear path to bring readers from point A to point Z. (panels are organized chronologically and exceptions aka flashback are explained in the narration), while users of a digital interface have more freedom. The story a website tells is, because of this, rather similar to the one of an open world video game. There is often a main storyline, but the user and the player are free to wander wherever they want in the process and are simply encouraged to follow the main storyline.


However, the designer’s goal is still to get the user from point A to point B.


So what are UX and UI?


UX, or User Experience, is the architecture of the product. UI, or User Interface, is the combination of each page’s visuals (pictures, colors, fonts, icons…). If UX and UI seem a bit abstract, think of the UX as the narration, the story of a comic book, while UI are the drawings of each page. UI is supposed to not only be “pretty”, but also to accompany and supplement UX efficiently.


Want to know how to create great design? Check our landing page for more information https://www.siclo-mobile.com/landing-design-uxui


Aug 09 2019