Ironhack prework 3— Classic Elements and Principles of Visual Design

Common on 4 designs which I like

Yi Zhang
4 min readJul 26, 2017

Design 1

Analysis of the design:

The design uses warm color (pink) and write background that provide a happy, hormonal and comfortable feeling. Two curves representing “income” and “outcome” stand out and highlight the comparison between income and expense. The shapes and lines all have smooth texture, however, the shadows and the texts in black and gray create a feeling of actual depth. Usage of the little icons in the transaction list should be highlighted, that makes the user have an intuitive sense of the payment attribution.

In general, the design makes the user easily interact with the interface.

Highlights:

  1. The design shows clear visual messages and information structure, that brings good user experience.
  2. Curves in different colors helps to percept.
  3. The icons in the transaction list are easily understood the expense attribution.
  4. The whole design has good balance. The distribution of straight lines and curves, main color (pink), other colors (blue, orange, red etc..) and the white background makes the entire interface comfortable.

The things that I don’t like:

The text in gray is a bit difficult to read, and I don’t understand why the color of the points are different in the right picture.

Design 2

Analysis of the design:

The designer smartly illustrates the theme of shortening meeting to save time. The design mainly comprise squares with different length and width, to represent the scales and the hands of the clock. Especially, the big hand of the clock is designed as the meeting table which the attendees sitting around, very creative!

Cool colors (dark blue and gray) provide the feeling of tension. The whole picture is in a asymmetrical balance but looks quite hormonal.

Highlights:

  1. In general, the designer clearly combines two objects with the similar shape (meeting table and the hand of the clock)to one. A vivid scene is created for the audience, so that it is easily understood the idea “shortening the meeting to save time”.
  2. The picture is with good balance. On the left side, it contains many small icons (meeting attendees, chairs, and the things on the table), on the right side, the number and scale of the clock are large and dark. But these two parts are balanced asymmetrically.

The things that I don’t like:

Maybe the background color can be lighter and cooler (such as white, or lighter gray), now it looks too “warm”.

Design 3

Analysis of the design;

The main colors of the design is black, white and light blue. The numbers, boxed and texts are well aligned, which provide a feeling of ordered and accurate.

Highlights:

  1. The design use aligned contents to provide a feeling of ordered and accurate, which supports the function — to have a clear record of the online payment.
  2. The information is well structured.
  3. Although the interface contains a lot of boxes, numbers and texts, the balance looks pretty good.

The things that I don’t like:

The numbers and texts are too thin to read. The color of the credit card is not proper, which makes it very difficult to be recognized.

Design 4

Analysis of the design:

Dark blue domains the design, which looks quite classic and shows a cool tune. The texts and numbers in gray and white create a feeling of actual depth. The contents are well aligned and structured.

Highlights:

  1. Only two colors are used, so the entire picture looks simple, concise and classic, which helps users to precept the main content.
  2. The curve in the middle is prominent, it clearly demonstrates the core information — change of payment vs. date.

The things that I don’t like:

There is too much space in the design, that makes it not balanced.

--

--

Yi Zhang

I am an enthusiastic UX / UI Designer based in Barcelona.