Stellar Logo Redesign Website

Branding
Adobe Illustrator
HTML/CSS
https://sites.millersville.edu/heblaine/Stellar_Revised/GIF of CSS Animation on Stellar Webpage

Overview

The goal of this hypothetical project was to redesign the logo for the cryptocurrency company Stellar. In addition to redesigning the logo I was tasked with additional deliverables including: 

- Dynamic usage of logo mark

- Lockup Options

- Color Palette

- Website Prototype


The format in which I presented my deliverables was up to me so I decided to format it into a website. Below is the deliverables shown individually, a recording of the website in full, as well as a link to the live website. 

Brainstorming

I knew from the beginning that this was going to be a challenging logo redesign for a few reasons. The primary reason is due to the main concept behind the brand. It is a space-themed concept, space has been done many ways, and is tricky to do in a way that is new and exciting. As such in my first moodboard, I tried to explore a variety of different ways to tackle the logo. I thought that utilizing negative space to create the logo would be effective since it would be different and more unique than a space-themed icon. In my second moodboard, I tried to explore some aesthetics for the branding. I wanted it to say space but also to be more abstract and unique. As such this moodboard is filled with images of ink in water and acrylic paint pourings.

Moodboard for Stellar Logo Redesign
Moodboard for Stellar Logo Redesign
No items found.

Sketches

In my sketches I explored a lot of different logo designs, some were more simplistic and some were more detailed. In the first set of rough sketches, I found myself being drawn most to the more simplified sketches since they would be able to work well in a variety of environments and mediums. Once I selected the logo sketch I liked the best I began refining it in more detail.

Initial Sketches for Stellar Logo Redesign
Refined Sketches for Stellar Logo Redesign
No items found.

In-Progress

A lot of my time for this rebrand was spent refining and adjusting the "S" in the logo. I hand rendered the S rather than using a typeface for the base so it took a lot of sketching and refining to get the character to feel balanced. Once I had the logo complete I began working on my other deliverables. The color palette and lockup options were all dependent on the logo so the deliverable I focused on was my dynamic logo usage. For this, I decided to make a CSS animation that incorporates the logo and could be used as a hero image on the Stellar website. Below you can see a small portion of the adjustments I made to the "S" as well as my sketches for the web animation.

In-Progress Versions of Stellar Logo Redesign showing refinement
Sketches for the hero section of the Redesign Stellar Website
No items found.

Final Piece

Below are screenshots of my final website which was my medium for presenting my deliverables to the hypothetical client. The screenshot below shows the logomarks, logo lockups, color palette, and typography, as well as a sample homepage for the company fully coded in working HTML/CSS. After the screenshots, I have a recording of the entire site and a link to look at the live site as well.

Final Stellar Logomarks in Black and White and Color
Final Stellar Logo Lockups in Color and Black and White
Stellar Redesign Color Palette and Typography
Screenshot of the hypothetical Stellar Website
Screenshot of the hypothetical Stellar Website
Screenshot of the hypothetical Stellar Website