Thoughts from Adam Foster
Agenda
ShipStation
Brand Voice & Tone
Voice vs. tone
• Your brand personality is composed of tone and voice and all the elements that make an individual unique and establish identity
• Brand voice stays the same
• Brand tone adapts to when, where, and to whom we’re speaking
Voice principles
• Shipping experts: Build trust and understanding through honesty and empathy
• Problem solvers: We pursue solutions because we know it makes lives easier. We speak accurately and intelligently about our product to illustrate how we can empower users to grow.
• Adaptability: No matter where or how you ship, we accommodate your shipping needs. From starter plans to enterprise plans we customize your shipping solution.
Brand voice + design
• We need consistency in our copy, our design, and in our brands
• Voice and tone isn't the same thing as writing good copy or having strong messaging. It's about using design and copy to create a distinct and recognizable brand • Design + Copy = A seamless recognizable brand
ShipStation
Brand Evolution 2020
ShipStation at a Glance
An Evolution, Not a Revolution
Presented by
Noah Suppin
Austin Faggard
Claire Queally
Design Lead
Visual Designer
Visual Designer
The Problems
Inefficient Workflow for Design Team • Lack of brand guidelines = time wasted every day making major designs decisions • Creating too many assets from scratch
Accessibility Issues • Robert and Susannah will elaborate more next Thursday (everyone should attend!)
Dated Look & Feel • Friction across the customer journey and product — what if someone visits us through a Partner?
Our Solutions
Visual Consistency • Established by a thorough style guide
Accessible Type & Color • Making the .com AA compliant
User-first, seamless experience • A seamless transition from partner sites and into product
The result: Higher conversion rates, the ability to attract more talent, futureproofing
Takeaways from our Brand Workshop Culture
Customers
Look & Feel
Voice & Tone
X-Factor
• Authoritative
• Multi-channel
• Reliable
• Functional
• Valuable content
• Intelligent
• Small/Medium/
• Spotlight on
• Frictionless
• Most carriers
• Clear
• Multi-channel
• Problem solvers
Large businesses • Passionate about their products
product • User-First • Features & Benefits • Helps business sell more • Saves the customer money
“SMB’s feel overwhelmed; Less is
“The Customer Voice — where is
more.”
it in all of that (referring to current website)?“
“ShipStation is a really technical company and we’re just now
“This feels 2020“
getting into relationship-building” “We want to talk about benefits, not features”
We’re utilizing the most successful design elements from the past 6 months and creating rules to move forward.
How do we know these are the right decisions?
Roboto is boring • System font created for Android in 2011 and a standard for most Google apps
Typefaces are an extension of voice and tone • Think about it… would you wear a suit to work in this office?
Already an existing brand, we want to build on our brand equity We experimented with a LOT of typefaces • Other options were too friendly, too stuffy… no option reflected our authoritative/trustworthy brand persona
Our solution: Graphik • Geometric San Serif • 18 font weights allows for flexibility to match the
Our solution: Graphik
Heirarchy & Lockups Vertical Rythym is on a scale of 4pt. When sizing down, try to maintain same relationship, but always optically corret. See 09 Web for info on web typopgrahy.
#SHIPSTATIONLIFE 40pt
The Shipping Software with the most 5-star reviews
Eyebrow - 10pt Font-Weight: Medium Letter Spacing: -25 Case: Caps
Headline - 56pt Font-Weight: Bold Letter Spacing: -25 Case: Mixed
40pt
Why is ShipStation the leading choice of online sellers? Because no other platform makes shipping faster, easier and more affordable.
Subhead - 18pt Font-Weight: Medium Letter Spacing: -25 Case: Mixed
40pt
Why is ShipStation the leading choice of online sellers? Because no
Body - 14pt
other platform makes shipping faster, easier and more affordable.
Letter Spacing: -25pt
40pt
Call To Action
Font-Weight: Light Case: Mixed
Button - 16pt Font-Weight Medium Letter Spacing: -25 Case: Mixed
Existing brand colors
New brand colors
SS Legacy Green RGB #26BC8E CMYK PMS
Moss RGB #297768 CMYK PMS
Koamaru RGB #2F3657 CMYK PMS
Taupe RGB #F4DFCE CMYK PMS
RGB #FBF2EB CMYK PMS
RGB #7BAAA1 CMYK PMS
RGB #82869A CMYK PMS
RGB #F8ECE2 CMYK PMS
RGB #4F8D82 CMYK PMS
RGB #595E79 CMYK PMS
RGB #F4DFCE CMYK PMS
RGB #297768 CMYK PMS
RGB #2F3657 CMYK PMS
RGB #B7A79B CMYK PMS
RGB #1B554A CMYK PMS
RGB #181B2C CMYK PMS
Accent Colors Candy Apple RGB #26BC8E CMYK 7, 81, 69, 0
Deep Sky RGB #26BC8E CMYK 50, 1, 3, 0
Maize RGB #26BC8E CMYK 6, 20, 86, 0
The Brand in Motion
Social Media & Webinar Template Examples
We’re getting a trim
Logo Adjustments
GAP
GEAR IS TOO CLOSE WITH N
Our Partners
How We Stack Up
Our Plan
Main goals: • Increase efficiency • Decrease production time • Increase conversion rates • More cohesive Brand-Product journey
Key Deliverable: Web Style Guide • Brand Overview • Voice and tone/Vocal Guide • Logos (Do’s and Don’ts) • Typography (Web & Print) • Colors • High-level UI patterns for marketing site • Guidelines for icons, pictograms, imagery
We need your help going forward • Are we asking the right questions? • Feedback? • Let’s work together!