top of page


Spring 2020




User Interface

Data Visualization

Levi's 2018 Annual Report

For this project I was briefed to create a microsite for the Levi's 2018 Annual Report. Annual Reports are documents that are sent out and published for shareholders of companies. It's important that an Annual Report communicates the company's successes and state of operations clearly and understandably to its shareholders so that they will continue to invest in the company in future years.

When creating the visual language for the Levi's 2018 Annual Report, I wanted to remain consistent to their original branding and UX/UI visual systems. Levi's is a trusted and established brand with lots of history and integrity. In recent years they have appealed to alternative audiences with their jean jackets and street style campaigns. For the branding I injected some of this classic Levi's feel, while giving it a little bit of an edge visually. While updating the brand to have more life and personality, I maintained a clean and understanding visual language.



I drew the color palette from the Levi's website and branding. I expanded the range of blues to mimic different washes of denim. I used the Levi's classic red an accent to the mainly blue palette. The page palettes were each inspired by a wash of denim and when all put together present the visual range of denim that Levi's produces. This approach allows for visual variety and separation from section to section while uniting the pages under the broader Levi's brand.

The type palette draws inspiration from the Levi's branding. I wanted a display typeface that is bold but friendly, paired with a geometric san serif for subheading and body copy to convey information and date easily and cleanly.

The elements draw visual inspiration from the physical material Levi's works with for their products. I created a button element and stitching to divide pages and add details. When I think of jeans I think of texture, but instead of adding jean texture to the pages I used faded photo backgrounds that were relevant to the information on their respective pages. I used numbers as bold accents.


This is the Splash page welcoming users into the microsite. It animates into the home/about page. This page tell's a little about Levi's history as a company and primes the user to read the rest of the annual report.


This is the Responsibility page. It details the company's commitments to the environment and what innovations and steps they are taking as a company to be eco-friendly from the ground up. The bottom of the page includes a carousel of statistics on different aspects of the environment to keep the page clean and add user engagement and interaction. 


This is the corporate fact sheet page. It contains data and numbers from all of the past year's most important statistics to give an overall review and impression of the company's state of operations. In order to give global summary, I first began with statistics by geographic region. I then moved into overarching data from the company and sales at large.


This is the Annual Report Page. This page is broken up into 3 different sections. Dear Shareholders, About our Shares, and Future Strategy. These sections go into further depth about the state of the company's shares and value, and what they are doing to move forward and continue to grow the company and brand successfully. I used pull quotes and pulled important statistics out to highlight the most important data throughout the report. 


bottom of page