How to create compelling online content through storytelling and stack panel design. Get clear on your marketing strategy and your goals for your website to be more effective.
4. What is effective storytelling?
Addressing your visitors’ wants and needs.
5. What is effective storytelling?
1. Good Design (You don’t distract or confuse them.)
2. Communication (You get them.)
3. Confidence (You guide them.)
7. Good Design
Doesn’t distract or confuse your visitor.
● Old design sucks
○ Based on print design; not good at communicating with your visitor
8.
9.
10. Good Design
Doesn’t distract or confuse your visitor.
● Old design sucks
○ Based on print design; not good at communicating with your visitor
○ Not responsive so hard to use on mobile devices, which leads to a higher bounce rate
○ Focuses on clicks instead of scrolling so difficult to navigate
○ Breadth, not depth
○ Crappy UX because people are overwhelmed with information, clutter, or disorganization
● Why it matters:
11. Good Design
Doesn’t distract or confuse your visitor.
● Old design sucks
○ Based on print design; not good at communicating with your visitor
○ Not responsive so hard to use on mobile devices, which leads to a higher bounce rate
○ Focuses on clicks instead of scrolling so difficult to navigate
○ Breadth, not depth
○ Crappy UX because people are overwhelmed with information, clutter, or disorganization
● Why it matters:
○ Confused and annoyed people don’t buy!
12. Good Design
Doesn’t distract or confuse your visitor.
● Old design sucks
○ Based on print design; not good at communicating with your visitor
○ Not responsive so hard to use on mobile devices, which leads to a higher bounce rate
○ Focuses on clicks instead of scrolling so difficult to navigate
○ Breadth, not depth
○ Crappy UX because people are overwhelmed with information, clutter, or disorganization
● Why it matters:
○ Confused people don’t buy!
● One-page or Stack Panel design
13.
14.
15.
16.
17. Good Design Doesn’t distract or confuse your visitor.
● Old design sucks
○ Based on print design; not good at communicating with your visitor
○ Not responsive so hard to use on mobile devices, which leads to a higher bounce rate
○ Focuses on clicks instead of scrolling so difficult to navigate
○ Breadth, not depth
○ Crappy UX because people are overwhelmed with information, clutter, or disorganization
● Why it matters:
○ Confused people don’t buy!
● One-page or Stack Panel design
○ Forces you to be clear and to focus on what really matters.
○ Forces you to be concise by telling the story of your biz in big blocks, and referring people to
landing pages for more detail
○ Gives depth, not breadth
○ Offers some whiz-bang = emotional satisfaction of interacting with the site
21. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
○ If you try to market to everyone, you’ll end up marketing
to no one.
22. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
2. Identify with their pain.
○ Builds trust.
23.
24. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
2. Identify with their pain.
○ Builds trust.
25. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
2. Identify with their pain.
○ Builds trust.
26. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
2. Identify with their pain.
○ Builds trust.
27. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
2. Identify with their pain.
○ Builds trust.
○ Specificity of the pain is what narrows your
demographic.
28. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
2. Identify with their pain.
3. Tell them that you have the solution.
29.
30.
31. Communication
You just get them.
1. Be specific. Don’t try to market to everyone.
2. Identify with their pain.
3. Tell them that you have the solution.
○ Use Features and Benefits
32. Features v. Benefits
What is it?
What does it have? What is it like?
90 minute intake process.
Been in business for 10 years.
Fancy phone case made of (big word)
plastic/alloy.
The coffee maker has a timer.
Why do I care?
How will it improve/change my life?
I create completely customized work.
Reliability, expertise, social proof.
You won’t break it. You won’t keep spending $$ a
year to fix it.
I can sleep in for 10 more minutes.
I won’t be late to work and get fired.
…whichmeansthat...
36. What is Your Goal?
a. Build your list?
b. Sell products?
c. Sell services?
d. Have someone sign up for a free consult?
e. Have someone call you?
f. Get more social shares?
g. Build your PR?
37. What is Your Goal? What do you need to do that?
a. Build your list? (prominent signup form?)
b. Sell products? (money-back guarantee?)
c. Sell services? (social proof?)
d. Have someone sign up for a free consult? (big
font?)
e. Have someone call you? (benefits?)
f. Get more social shares? (better content?)
g. Build your PR? (show events? press releases?)
38. Confidence
You guide them.
Now that you know your goal, you can address theirs. What’s their pain? What are
they looking for? How can you put that together in a clearly communicated, stack
panel site?
Give people an introduction to orient them to the site, even if it’s just a graphic.
Consider layout, color and font choices to make sure you’re delivering the right
‘feel’.
39. Stack Panel/Homepage Order
1. Introduction
a. Design, graphics, logo, taglines, mission statements (beware sliders)
2. Mission statement, quotes, tagline
3. Services, Products (use Features/Benefits!)
4. About, Bio, Team (use bubble wrap effects!)
5. FAQ/more details
6. Location
7. Quotes, Testimonials
8. Call to Action (make it EASY and OBVIOUS)
40. My Goal:
For you to witness and recognize your own
brilliance, to get reconnected to your
dreams and fall in love with yourself all over
again.
From THAT place, you can interact with the
world in a bigger way