AWAY is a direct-to-consumer luggage company with a strong following among young travelers. The brand also launched a travel magazine titled, Here Magazine. Until now, the two brands have had separate identities, despite efforts to cross-reference, and it hasn't been clear that they are related.
How might we create a unified brand identity for both AWAY and Here Magazine?
AWAY and Here have two distinct personalities.
AWAY represents the joy of travel. Here represents the thrill of discovery and culture.
Create a new brand identity, design system that emphasizes exploration.
Audit an existing brand and re-imagine their brand identity and product extension
At its core, AWAY is a travel brand that offers premium products for the seasoned traveler. They've capitalized on this identity with the expansion of their sister company, Here Magazine, but currently the two brands have separate personalities. What if there was a way to combine the power of the two to create a more cohesive and enjoyable experience?
Demographic: Young people, ages 18-35
Primary countries: United States
Interests: Travel, photography, creative fields, influencer marketing
Create a unified design system that can be used for both AWAY and Here Magazine and emphasizes the aspect of travel and exploration. Implement a more intuitive navigation to simplify finding information. Introduce a new creative content piece that showcases the inspiration behind AWAY's color palette based off of Here Magazine's curated travel guides.
Additional context: This project was completed in Fall 2019. AWAY redid their design system and web interface in late winter/early Spring 2020. Elements of this project have been revised to fit within AWAY's current design system.
AWAY's average luggage prices for roughly $200 per unit. That's a steal compared to $1K+ for a competitor item from Tumi or Rimowa. Yet, compared to other mid-priced competitors like Samsonite or Delsey, AWAY presents an alluring image of exuberance, refinement, and luxury.
Here Magazine creates custom city guides for famous locations such as Jaipur, Ubud, Madrid, and more. Every city has its own flavor and flair that presents itself through architecture, color, and pattern.
part one
Elevated brand principles and color naming based off of Here's magazines city guides
part two
Eliminating nested pages, creating four nav tabs: Shop, Personalize, Discover, and Get Inspired
part three
Interactive lookbook exploring new color-ways with links to matching Here city guides
I created four brand principles.
For typography, I applied light changes to AWAY’s existing typefaces, specifically choosing ModernoFB as my primary serif font to add a little bit more personality to my design system. I also chose Roboto Mono as my mono font for additional headings and Avenir as my primary sans serif font for heading, subhead and body.
As it exists today, AWAY's color palette is very basic. The primary colorways are Black, Navy, Green, Asphalt, Coast, White, Sand, Blush, and Brick. After establishing my brand principles, I decided to revise AWAY's color palette to have more flair and be more aspirational. Because one of my main priorities was to create tighter integration between AWAY and Here Magazine, I decided to take the city names from Here Magazine's city guides and apply them to my colorways. My main nine colors are Jaipur, Lisbon, Shanghai, Monaco, Cape Town, Madrid, Mexico City, Ubud, and Dublin. This initial decision heavily influenced my idea to build a feature around my color palette.
The Color Passport is an interactive lookbook designed to highlight AWAY's color palette and the cities that inspired it. As mentioned above, I redesigned AWAY's color taxonomy to be based on Here Magazine's city guides. The Color Passport features all nine colors and cities — Jaipur, Lisbon, Shanghai, Monaco, Cape Town, Madrid, Mexico City, Ubud, and Dublin. Each color page contains an image of the location, short summary, link to the Here Magazine guide, as well as an option to shop the color in one of AWAY's four main sizes.
Each page showcases the main color swatch, the product image, and a matching city image. This visual is designed to convey the character and personality of the city, visually explain how the color was inspired by the city landmarks.
Each Color Passport page features a short summary blurb that is derived from the larger Here Magazine guide and highlights two to three main city attractions. Each summary ends with a link to read the full article on Here Magazine’s main webpage.
If a user is interested in a particular color, they can hover over one of the suitcase icons below the city description to shop in their desired size -- Carry-On, Bigger Carry-On, Medium, or Large. Once at the product page, they can return back to the Color Passport if they wish to do so.
I animated my suitcase icons so the handles popped up and wheels appeared when a user hovered over them. I wanted to convey the feeling a traveler has when about to embark on a journey and the excitement that comes when you click your luggage handle up! I added a tooltip beneath each icon to make the feature more accessible.
This was my first UX/UI project at Brandcenter, and it was quite terrifying at first. I made a lot of mistakes early on, but I kept improving. Doing the project again a second time felt exhilarating, knowing now that I had the confidence in knowing I had done it before. If I had more time to dedicate to this project, I would love to consider building the feature out for mobile and also invite more user feedback to keep improving the navigation flows.
3.1 Phillip Lim is a global luxury fashion brand based out of New York City. Since its inception, it has prioritized diversity and bringing awareness to social issues through its collections, collaborations, and media activities. However, many of these activities are disjointed.
How might we create a space for 3.1 Phillip Lim to celebrate and expand these efforts?
Digital and physical brand experiences don't align.
Individual projects carry strong brand value and deserve recognition.
Consolidate all brand endeavors under one single program.