Categories
Visual Language

Week 5

Personal Brand

The Idea

This week we had to develop a personal brand. This involved creating a logo, a color scheme, and typography which would accommodate any type of personal media I want to publish. I took the logo I used the last couple of years as a starting point. First, I decided to discard the “L” from my last logo. I wanted to create something more uniform and iconic: a streamlined, easily adaptable icon that can be used in different mediums and with multiple variations.

In that sense, I decided to design everything based on the “A” in Alvaro.

2017 logo

The Typography

While looking through several typographies, I went for my usual fixed-width kind of style. Sans serif seemed like the type family to look at, so I tried several different variations with my name until I decided to use Sharp Grotesk, bold 15.

The Logo

Logo_BoverW
Logo_BoverW
Logo_WoverB
Logo_WoverB

For the logo, I experimented with different “A” variations that could implement the A, J, and L initials in a subtle way. Also, I noticed sharp angles go well together, and probably the fixed-width approach would serve me well in this part too.

Though I battled against my “rounded” intuition, a sharp-edged Logo would definitely work better with my chosen typography.

As for the color palette, I can’t go against my monochrome nature. I chose black and white variations as part of my logo. However, I played around a bit more and found that gradients look beautiful inside the logo as well, so it was a win-win situation.

LOGO_Letters
Logo deconstructed into different letters

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Categories
Visual Language

Week 4

ITP Winter Show Proposal

The Idea

As a part of our development in the Visual Language class for the fourth week, I created a design as a proposal for the 2019 ITP Winter Show. The Idea was to give it a human feel to the composition, away from the Arduino, cables, and devices imagery that have characterized the previous posters.

The Color Palette

Poster Color Palette
Color palette made using the Adobe color create online tool

The Composition

I decided to use Michelangelo’s famous painting “Adam’s Creation” as a starting point for the composition. Beyond any interpretation that derives into the relationship between the human and the divine, the painting for me is representative of a master craftsmen’s dream. A human dream.

On the other hand, I wanted to break this relationship with divinity and introduce our new idol: Technology. In that sense, i put a semicolon representative of the type that must go at the end of every line in Javascript.

The Result

Final Design
Final Design

Thanks for reading!

Categories
Visual Language

Week 3

Color Experiments

The Idea

As a part of our development in the Visual Language class in the third week, I created 5 compositions that somehow gave the idea of a palette of myself. For most of my work I have used black and white compositions, and once in a while a monochrome. I thought it was a good opportunity to test color gradients in between. I made 4 images and a video.

The Color Palette

Chosen Color Palette
Color palette made using the Adobe color create online tool

The Compositions

I decided to make the compositions with a software I love and with which I have been playing with a lot lately: Unity3d. As a game engine it allows for multiple camera shots and color configurations in real-time. I decided to use particle systems to create interesting variations, and also use an exaggerated amount of bloom to display a wider gradient between pure white and black.

Color experiment 1
Color experiment 1
Color experiment 2
Color experiment 2
Color experiment 3
Color experiment 3
Color experiment 4
Color experiment 4

https://youtu.be/Tt5ssdml9TY

Thanks for reading!

Categories
Visual Language

Week 2

Redesigning a Delta Airlines boarding pass

The Idea

As a part of our development in the Visual Language class in the second week, we had to  redesign an airline ticket from Delta Airlines.

Original boarding pass.
Original boarding pass.
Redesigned boarding pass
Redesigned boarding pass

Hierarchy of Elements

In terms of hierarchy I tried to relay the nominal data towards the left side of the ticket, with most of the numerical data is towards the center. I set a dark bar across the first upper third section to display the most important data you need when you’re trying to find your way through the airport.

Type

For the font type I used Helvetica, commonly used for information display format,  commonly used because of it’s fixed width and legibility. For each information displayed we have a descriptive title with a font size of 28, and it’s corresponding data is precisely half the size. After testing on print, I found that 10 was the minimum font size for the text to be actually legible at a reading distance. That’s why  the “stub” has this minimum as it’s font size.

 

Color system

Boarding pass color palette.

Besides the Delta Airlines style guide determined blue and red, I chose  a grayscale for the rest of the boarding pass. This was done so the background and the text could have a nice contrast.

Thanks for reading!

Categories
Visual Language

Week 1

Design Analysis of “Mr Nobody” poster

Mr Nobody movie poster.

As a part of our development in the Visual Language class for the first week, we had to choose a book cover, poster, packaging or any form of graphic design.  I chose “Mr. Nobody”, a cult film released in 2009 and directed by Jaco Van Dormael which tells the story of the last mortal human in a futuristic immortal society.

Mr Nobody poster structure.
Mr. Nobody poster

Hierarchy of Elements

In terms of hierarchy we can see that the character’s head is the main part of the image. In terms of visual real estate, it covers the most terrain.  and most of all a color predominancy contrasting the white background, stark. The concentric rings around the character’s face make it seem as if his face is constantly shifting, in movement, and as in the movie, moving through time. It also makes us understand that the movie is surely going to be focused around this character.

Type

I used the What the Font? tool to find that Blacktie seemed to be the most similar font. For this specific title, however, it seems as if the font was personalized for the movie. It seems to be wider and missing some parts as to give it a more “cybernetic” type of look. I would even say that they mixed it with another font called “Futurist Fixed”. Investigating a bit more, I found that the font for the title and the credits is in the “fixed-width” style.

 

Futurist Font
Futurist fixed font.
Font search result.
Blacktie font.
Font search GIF
Font search GIF

Color system

"Mr. Nobody" color pallette

Most of the color in the image is concentrated in the center, on the character’s face. In that sense, most colors are from the lighter pinkish skin tone area. 

The rest of the image is composed of white tones, almost reaching a ghostly winter grey.

 

HEX codes for each color here.

Movie trailer