Cubism logo

Website Design

Moodboard

Geometry Transformation Anti-traditional

moodboard

Colours

PROVINCIAL PINK
HEX #FDF5F2
RGB 253,245,242

ALMOND
HEX #F4E1CF
RGB 244,225,207

ORANGE YELLOW
HEX #F9D068
RGB 249,208,104

CG RED
HEX #D9322A
RGB 217,50,42

ASPHALT
HEX #0F0506
RGB 15,5,6

LOGO

SHAPE: The basic shape of an eye was split into 2 flat shapes representing the views of it from different angles. It was inspired by analytical cubism, which has the more austere or serious look.

COLOUR: For the basic logo, colours were chosen to be black and white.

FUTURE COLOURING OPTIONS: To incorporate the synthetic cubism features in the logo, there is an option to colour the logo using the colour theme of the synthetic cubism (the colour palette form the page 2).

Final Logo

LOGO

Typography

MARVIN VISIONS

Titles, Decorations

Marvin Visions is a modern and consistent typeface originally designed by Michael Chave in 1969 and published by Face Photosetting. It has been revived by Mathieu Triay for the identity of Visions, a new science fiction magazine that aims to be a literary introduction to the genre, mixing classic texts with new writing.

ROBOTO

Subtitles, Headings, Subheadings, Body

Roboto forms are largely geometric. At the same time, the font features friendly and open curves. Roboto allows letters to be settled into their natural width. This makes for a more natural reading rhythm more commonly found in humanist and serif types. It has a regular family, which can be used alongside the Roboto Condensed family and the Roboto Slab family. It is made by Google for Android interface.

Since Roboto typeface is rich in its variations, is well polished, geometric san serif (neo grotesk) and it is great for reading, I chose it for the main text, to match the more eye catching Marvin Visions typeface.

Assets

IMAGE ASSETS

LARGE IMAGE
Dimentions 1666px x 1500px
Resolution 72 pi
Size 831 KB

Large image example

*Dispite of the large image file, it looses quality because of the automatic browser compression for a smaller screen. If the image was displayed on a large screen it would not loose this much quality.


MEDIUM IMAGE
Dimentions 500px x 450px
Resolution 72 pi
Size 561 KB

Medium image example

*Around 300px - 500px works great with phone displays


MEDIUM IMAGE
Dimentions 150px x 135px
Resolution 72 pi
Size 61 KB

Small image example

*Around 150px is great for small images. If not streched, it will look great and take least space.


FOLDER STRUCTURE

Folder structure on web example image