Magic Labs
Visual Identity
Web
ROLE
Sr. Visual Designer
Illustration
DATES
AUG 2020 → MAR 2023
Sean Li
(Founder & CEO)
Zack Labadie
(Lead Product Designer)
Micky Teng
(Head of Marketing)
Ian Smith
(Lead Software Engineer)
Adenekan Wonderful
(Sr. Frontend Developer)
COLLABORATORS
Magic provides the leading wallet-as-a-service plus essential NFT capabilities. This method aims to enhance security, facilitate seamless onboarding, and eliminate the need for users to remember and manage passwords.
At Magic, I was committed to enhancing the brand's visual identity and communication strategy across various platforms. My role involved refining the aesthetics of customer touchpoints, including websites, emails, marketing materials, and presentation decks. Here are some key highlights from my work at Magic.
Web Design
For Web3 projects at Magic, I prioritized user education, privacy, security, and aligning design with our unique branding and tried communicating with users easily and simply. Through thorough competitor analysis and collaboration with my team, I ensured seamless user experiences and effective communication of product features.
Homepage Evolution from 2020 to 2022
QUARTERLY UPDATES
Each quarter, our team set goals for our products. One major challenge we encountered was updating the homepage with new features, announcements, and approaches to effectively engage our customers and users. We aimed to ensure that users quickly grasped the benefits of our product, encouraging them to utilize it.
All interactive functions have been replaced with images in this mockup!
In Q4 2020:
We emphasized our authentication types which users can easily sign up for using passwordless methods.
In Q1 2021:
Our team elevated the visual design, highlighted the importance of the copy, and seamlessly introduced new features to users by integrating our new mascot, "Hiro," into our branding for the first time.
In Q3 2021:
In this update, our goal was to exemplify our boldness, dedication to quality work, and capacity to instill trust through distinctive perspectives and cohesive visualizations.
In Q2 2022:
In June 2022, Magic introduced "Magic Connect" at NFT NYC 2022 to simplify NFT purchases. This innovative tool lets users buy NFTs using just a Credit, Debit, or Instant Bank ACH, without needing crypto or fiat on-ramps. With Magic Connect, buying NFTs is easy and hassle-free for everyone.
In Q3 2022:
Following NFT NYC 2022, our focus shifted to showcasing the features and benefits of Magic Connect, emphasizing its speed, ease of use, and simplicity compared to other Web3 wallets.
Short animations for the website
Here are examples of how the Magic website delivers messages through visual communication with simple animations.
Brand Expression
These works showcase how the various brand elements—logo, photography, typography, illustration, tone of voice, and motion design—blend harmoniously to craft a compelling brand identity that deeply connects with audiences.
The Wordmark Improvement
I refined our logo with subtle enhancements and transitioned the font in the wordmark from Proxima Nova to Inter. The "a" in Inter exudes a friendlier and more sophisticated vibe. Whether using large or small sizes, Inter maintains great readability.
The Meaning of the Logo
The logo's concept is designed to convey the essence of protection and security, embodied by the imagery of a shield and key. I created a simple yet impactful animation featuring the symbol for the login page.
The Brand Guidebook
We developed comprehensive brand guidelines to address a gap we noticed in existing resources. Our Brand Guidebook provides thorough guidance on all aspects of brand execution, ensuring consistency and excellence across marketing channels.
Mascot:HIRO
Hiro's lower body has a shape similar to the letter "M", and his overall appearance is easily recognizable due to its simplicity.
What Are the Advantages of Having a Mascot?
We believed that the effectiveness of a mascot depends on factors such as its design, relevance to the brand, and execution. A well-designed and strategically integrated mascot can bring numerous benefits to a brand.
Brand Recognition
Emotional Connection
Storytelling and Brand Story
Versatility and Flexibility
Appeal to Different Audiences
Brand Extension and Merchandising Opportunities
Hiro’s expression icons.
Hiro in Branding: Website, NFTs, Banners/Ads, and Blog.
Times Square Billboard Advertising during NFT NYC 2022 in New York.
Designing awesome swag items is always a blast!
Hiro in branding at NFT NYC 2022.
Illustration
The illustration process.
Magic's branding illustrations serve to uniquely convey its identity and values, enabling differentiation, storytelling, enhancing brand personality, and simplifying complex concepts.
Artwork Examples for Blog
Click on each image to explore the articles!
NFT Collection of ETHDenver in 2022
During ETHDenver, I created NFT collections in a 2D style. These collections served as individual cards we offered to people who signed up for Magic. We aimed to captivate audiences and generate incentives to use our product.
Hiro Stickers
Although these stickers were created for swag and internal or external events, the collection of different styles is still consistent and expresses Magic's unique branding, making it a good template for other illustration work.
Hiro sticker collection.
I designed a poker card deck as swag for marketing purposes
Small but Powerful Illustrations
I crafted each small illustration to suit specific contexts, commonly used in web design or company presentations, offering numerous benefits in engaging customers in a friendly manner.