soundcore Brand Visual System
UX Design Intern, Jun 2025-Aug 2025
-My Role-
Guideline Consolidation / Cross-Channel Application / Amazon & DTC Layout / Offline Collateral
-Project Goal-
Turn existing brand rules into a usable system and apply them consistently across Amazon, Web, and Offline touchpoints
-Outcome-
20+ ASSETS DELIVERED
3+ CHANNELS COVERED
+8% AMAZON STORE CTR
Overview
Moodboard
soundcore is Anker’s audio brand, appearing alongside Anker across Amazon, the DTC website, social media, and retail.
I consolidated its brand guidelines into one usable system and applied it across 3+ channels, delivering 20+ assets and an 8% lift in Amazon Brand Store CTR.
Problem
Brand rules already existed, but they were scattered and hard to apply.
In practice, logo sizes, endorsement placement, and layouts varied from channel to channel, which weakened brand recognition.
Before consolidating the guidelines, I immersed myself in the brand's tone and created mood boards to capture its visual direction.
Consolidating the Guidelines
With the look and feel defined, I turned to the rules themselves.
Most of them already existed, but they were scattered and easy to misread, so the first step was to bring them together into one structured guideline.
01 Endorsement & Logo Balance
Endorsement: a weak-association approach, with the Anker logo fixed at the bottom-right.
Logo balance & scaling: unified logo heights across sub-brands, with 0.75x / 1x / 1.25x rules.
Logo Size Rules
Category Brand Logo Principles
Corporate Brand Logo Principles
1/16
1/16
1/16
1/16
x
0.75x
0.75x
x
0.5x
1.25x
soundcore Brand Identity Guidelines
8
Logo Height Based on Balance Principle
Endorsement follows a weak association approach.
Sub-brand and category brand logos are displayed alongside the corporate brand logo within the same layout, arranged horizontally (left and right).
The corporate brand logo is fixed at the bottom-right corner of the layout.
1 Endorsement
H
02 Grid & Breakpoints
Grid & breakpoints: XL ≥1920px (128 margin / 32 gutter) and XS <768px (16 / 4), with gutter = 1/4 of the margin.
soundcore Brand Identity Guidelines
8
DTC Layout
Grid System
- In vertical layouts, the column gap (gutter) should be 1/4 of the margin width.
Breakpoints
XL (≥1920px)
- Margin: 128px
- Gutter: 32px
- Based on a 1920px canvas for responsive design
XS (<768px)
- Margin: 16px
- Gutter: 4px
- Based on a 390px canvas for responsive design
Note : The right side shows typical examples for XL (≥1920px) and XS (<768px) layouts.
3 Web
Sound On. Move On.
Best deals
Headphones
Earbuds
Speakers
New Releases
Explore
Support
All-New AeroClip
"The Best-Sounding Open-Ear Buds I Have Tried"
Learn More
Shop Now
Adaptive Comfort
Open-Ear Clip-On Earbuds
Dynamic Voice Capture
Al Clear Calls
Unmatched Sound
Powerful Bass
All-New AeroClip
"The Best-Sounding Open-Ear Buds I Have Tried"
Learn More
Shop Now
Adaptive Comfort Open-Ear Clip-On Earbuds
Dynamic Voice Capture Al Clear Calls
Unmatched Sound Powerful Bass
Sound On. Move On.
XL & XS grid
03 Social Specs
Social specs: a 32×32 avatar grid, and a 1500×500 X cover with an avatar-safe zone.
Avatar on a 32×32 grid
X cover with avatar-safe zone
Goal: give designers and vendors a guideline they can actually us e .
Applying the System
A guideline only proves itself in real layouts.
I put the system to work across three channels: Amazon, Web, and Offline, testing each rule against real sizes, devices, and formats.
01 Amazon Brand Store & Brand Story
Top Banner (3000×600): above a 4:1 ratio, the sub-brand logo scales to 2x while Anker stays at 1x.
Top Banner: three layout options
Brand Story module adapted for desktop and mobile.
Brand Story on desktop & mobile
Banners live on the Amazon Brand Store
02 DTC Website
Applied the XL/XS grid to the AeroClip hero, so the layout stays consistent from 1920px down to a 390px mobile canvas.
03 Offline
Exhibition rack corner marks standardized across large, medium, and small racks, keeping the 10° angle language.
Exhibition rack corner marks
X-stand and out-of-home poster for Liberty 4 Pro, carrying the same logo lockup and layout into physical space.
X-stand
Out-of-home poster
Packaging
End -
-