* CLICK * BACK * TO * TOP 🐯
HOME WORK ABOUT CV

New Ugly

Overview

Summer 2020 | 3 Months | Aesthetics Analysis

Today everything all lives under certain rules. In terms of design, there are many principles such as colors, grids, typography. That makes me think why only design that follow rules can be good design? Are there any deliberately ugly designs for certain purposes? Should we call them ugly just because they break rules? That’s where this project was born from.

There are many presences of ugliness in our surroundings. So I decided to explore the so-called ugly design in various forms and challenge the system of design rules. This process also challenged myself since it’s against my aesthetic standards but it exactly makes this project interesting. During the querying process, I digged into this obnoxious language to access the role of ugliness and tried to combine it with other forms in my own ways.

Role

Visual Research
Motion UI
Typography

01. Inspirations


02. Research


Affinity Mapping

Mind Map

03. Experiments


I. Color Collage

I collect the so-called “ugly” ads and create color patches to see if they would look good without text, but this style is too similar to Yui Takada’s “New Ugly” series. So I explore the “ugliness” of graphic brutalism style in the next stage.

II. Graphic Brutalism

Brutalism in digital design is in a unadorned style, which echoes the features in architectures. Both of them shakes designers out of our comfort zones.

III. Brutalist Elements

Ther rise of graphic brutalism is because it gives designers creative freedom which they don’t normally get. There’re no rules to follow and designers are free to experiment with forms, contents, and anything. By rejects rationalism and functionality, brutalist elements can be defined as

04. Series I


I. Font Family

To get out of the traditional perfect geometrics, I twist color collages and integrate into a big one with less white space, and create a new font family to echo the new ugly style.

To get out of the traditional perfect geometrics, I twist color collages and integrate into a big one with less white space, and create a new font family to echo the new ugly style.

II. Letter Stickers

Since the new style is mostly known by designers, people are not familiar with it and would misunderstand it as a “bad” design. So, I use the font family to create a series of Snapchat stickers to let more people know about this style.

III. Typographic Posters

I also use the font family to create typographic posters, which break out the traditional poster layout and typesetting. I focus more on the concept of distortion and irregularity to walk out the comfort zone of typographic posters and get out the restriction of gird, space, hierarchy, etc.

05. Series II


I. Ugly Ads Redesign

The first series focuses more on the ideology, this series will look into typical “ugly” existing designs. They are always damaged and in low-pixel. I redesign them with the elements I derived from broken-rule styles.

Motion UI

Cursor interaction: shapes move with the mouse
Background patterns and layouts change with each click
Hidden and hover interaction: images appear when hovering
Scrolling animation: text banners scroll automaticall
Cursor animation: images move with the mouse and leave behind a trail of images