SlideShare a Scribd company logo
1 of 76
We ask questions about your brand, your
audience, your key messages, what people
believe about you now, what you want
them to believe.
We ask about your competitors and your
design preferences. And more questions!
First, we meet face to
face, unless you are in
another country!
And then, once we have gotten to know
you, we get you to fill out our amazing
design briefing questionnaire
We need info
It’s easy, don’t worry.
You just answer the
questions.
When we design websites, we start with
2-3 different initial homepage concepts,
all based on the design brief and what
we have learned about you!
Then we work on “look and
feel” designs
You need to see and love your design
before we build it.
Here are three concepts for our client, a
restaurant in Clapham. You can tell they
are all the same company but the layouts
are different.
Example:
Carmen Bar de Tapas
In that meeting we did a “live design
session”. This one involved radical
variations, an exciting session where we
combined elements of the 3 initial designs
to make a completely new 4th design,
which our client signed off.
Check it out (see next slide!)
Once we showed those first three
designs we had our client from
Carmen Bar de Tapas in for a
design presentation meeting
By involving you in the “live design session”
we combine our expertise with your input
and knowledge of your business and
clients.
“Live Design Session”
Involve You
The next example shows a wedding
planner. In her brief she asked for a luxury
feel and specified a dark background. So,
we showed 2 concepts with a dark
background, and one design with a light
background.
Example:
Flutterfly Events
Then we had the client in for our “live design
session” and in that session, we came up with
this design:
As you can see it’s a light background image!
But to be sure, we reminded our client that she
had originally specified a dark background, and
showed her this in the same “live design
session” – to be sure!
She went home to think about it, and decided
on the light background one!
So, one she signed off the design for the
homepage we designed each inner page –
every page is designed according to the
purpose of that page.
As you can see there is consistency in the
header, footer, positioning of the navigation and
the footer design, but the content area of the
page differs. We do this with all our bespoke
designed sites.
This website has all the makings of a high
end professional hairdressing salon – but
with added personality!
The salon owners have 2 dogs who feature
on the site – as do all the stylists on a very
comprehensive teampage. Each page is
different.
Example:
Kell Skött Haircare
Popup windows on each of the team bios
show who works at the salon.
The rest of the site is very informative and
builds confidence and trust.
Kell Skött also has a strong social media presence,
which is core to their marketing activities.
We also design for
tablets and phones.
Consider how many of your audience are using their
phones or mobile devices to visit your website, see
your social media posts, read your blogs, speak to you
on social media.
The following slides show one of our clients, Aspire
Leadership – and how their site looks in a browser –
and on a mobile phone.
Another example – Astute Property Search –
you can see how his site looks in a browser, and
then on an iPhone.
Sometimes we create single page
sites – see some examples:
The next few slides show how a single page
site can have a “content slider” – where different
images and text either fade into each other or
slide between each other, in the same place.
On a single page site, you can use a slider to show a
number of images and key messages.
To see it in action, visit www.unconventional.sg
And more often than not, we design blogs into
the website. This works best when it’s
seamless – the blog is a part of the website,
and doesn’t open up in a new window.
We love blogs.
Integrate the blog into your
website
Plan content ahead of time
Watch your formatting
Always include a picture
Post regularly
Think of amazing headlines
Share your posts on social
media
Superblogging tips
Visit our website: www.topleftdesign.com to ask us any questions. We
are very nice and friendly!

More Related Content

What's hot

Product Camp 2012 - Harding
Product Camp 2012 - HardingProduct Camp 2012 - Harding
Product Camp 2012 - HardingMike Harding
 
3. fmp production experiments (1)
3. fmp production experiments (1)3. fmp production experiments (1)
3. fmp production experiments (1)Ellieschreurs
 
8 Work From Home Jobs For Freelance Writers
8 Work From Home Jobs For Freelance Writers8 Work From Home Jobs For Freelance Writers
8 Work From Home Jobs For Freelance Writersrustysteven
 
3. fmp production experiments (1)
3. fmp production experiments (1)3. fmp production experiments (1)
3. fmp production experiments (1)Ellieschreurs
 

What's hot (6)

Product Camp 2012 - Harding
Product Camp 2012 - HardingProduct Camp 2012 - Harding
Product Camp 2012 - Harding
 
Cover letter
Cover letterCover letter
Cover letter
 
3. fmp production experiments (1)
3. fmp production experiments (1)3. fmp production experiments (1)
3. fmp production experiments (1)
 
Weekly update 1
Weekly update 1Weekly update 1
Weekly update 1
 
8 Work From Home Jobs For Freelance Writers
8 Work From Home Jobs For Freelance Writers8 Work From Home Jobs For Freelance Writers
8 Work From Home Jobs For Freelance Writers
 
3. fmp production experiments (1)
3. fmp production experiments (1)3. fmp production experiments (1)
3. fmp production experiments (1)
 

Similar to The Top Left Design Design Process

Presentation
PresentationPresentation
Presentationjoelyp
 
A LOGO IS NOT A BRAND
A LOGO IS NOT A BRANDA LOGO IS NOT A BRAND
A LOGO IS NOT A BRANDPaul Hebron
 
15 Content Marketing Ideas to Attract First Users to Your SaaS Product
15 Content Marketing Ideas to Attract First Users to Your SaaS Product15 Content Marketing Ideas to Attract First Users to Your SaaS Product
15 Content Marketing Ideas to Attract First Users to Your SaaS ProductPawel Grabowski
 
A Tale of Two Designers
A Tale of Two DesignersA Tale of Two Designers
A Tale of Two DesignersMarc Anderson
 
Stop Making Pretty Websites That Suck
Stop Making Pretty Websites That SuckStop Making Pretty Websites That Suck
Stop Making Pretty Websites That SuckBarry Saunders
 
Business enterprise reflective report
Business enterprise reflective reportBusiness enterprise reflective report
Business enterprise reflective reportElizabethBroughton2
 
Why Design Matters: How to Make Your Website Worth a Million Visits
Why Design Matters: How to Make Your Website Worth a Million VisitsWhy Design Matters: How to Make Your Website Worth a Million Visits
Why Design Matters: How to Make Your Website Worth a Million VisitsSchoolwires, Inc.
 
Tva 360° virtual tours finished
Tva 360° virtual tours   finished Tva 360° virtual tours   finished
Tva 360° virtual tours finished Brett Henderson
 
Swaits evaluation
Swaits evaluationSwaits evaluation
Swaits evaluationTop_Boy
 
Design Expertise
Design ExpertiseDesign Expertise
Design Expertisecds php
 
121 Creative Credentials
121 Creative Credentials121 Creative Credentials
121 Creative Credentials121 Creative
 
5 simple steps to map your visitor journey and optimise your website for conv...
5 simple steps to map your visitor journey and optimise your website for conv...5 simple steps to map your visitor journey and optimise your website for conv...
5 simple steps to map your visitor journey and optimise your website for conv...Lisa Jansen
 
What Makes A Good Website 2009 Sth Man
What Makes A Good Website   2009 Sth ManWhat Makes A Good Website   2009 Sth Man
What Makes A Good Website 2009 Sth ManJohnKeys
 
UX Tools, Tips & Tricks for Code(Her) Conference 2015
UX Tools, Tips & Tricks for Code(Her) Conference 2015UX Tools, Tips & Tricks for Code(Her) Conference 2015
UX Tools, Tips & Tricks for Code(Her) Conference 2015Katelyn Caillouet
 
Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...
Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...
Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...visualdesignthinking
 
Bulgaria Web Summit #VDT Visual Design Thinking
Bulgaria Web Summit #VDT Visual Design ThinkingBulgaria Web Summit #VDT Visual Design Thinking
Bulgaria Web Summit #VDT Visual Design ThinkingChiara Francesca Albanesi
 
Suckerpunch Portfolio June2010
Suckerpunch Portfolio June2010Suckerpunch Portfolio June2010
Suckerpunch Portfolio June2010ommacreative
 
Ashton Spann : Portfolio Sample
Ashton Spann : Portfolio SampleAshton Spann : Portfolio Sample
Ashton Spann : Portfolio SampleAshton Spann
 
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.Brody Dorland
 

Similar to The Top Left Design Design Process (20)

Presentation
PresentationPresentation
Presentation
 
A LOGO IS NOT A BRAND
A LOGO IS NOT A BRANDA LOGO IS NOT A BRAND
A LOGO IS NOT A BRAND
 
15 Content Marketing Ideas to Attract First Users to Your SaaS Product
15 Content Marketing Ideas to Attract First Users to Your SaaS Product15 Content Marketing Ideas to Attract First Users to Your SaaS Product
15 Content Marketing Ideas to Attract First Users to Your SaaS Product
 
A Tale of Two Designers
A Tale of Two DesignersA Tale of Two Designers
A Tale of Two Designers
 
Stop Making Pretty Websites That Suck
Stop Making Pretty Websites That SuckStop Making Pretty Websites That Suck
Stop Making Pretty Websites That Suck
 
Business enterprise reflective report
Business enterprise reflective reportBusiness enterprise reflective report
Business enterprise reflective report
 
Why Design Matters: How to Make Your Website Worth a Million Visits
Why Design Matters: How to Make Your Website Worth a Million VisitsWhy Design Matters: How to Make Your Website Worth a Million Visits
Why Design Matters: How to Make Your Website Worth a Million Visits
 
Tva 360° virtual tours finished
Tva 360° virtual tours   finished Tva 360° virtual tours   finished
Tva 360° virtual tours finished
 
Swaits evaluation
Swaits evaluationSwaits evaluation
Swaits evaluation
 
Design Expertise
Design ExpertiseDesign Expertise
Design Expertise
 
121 Creative Credentials
121 Creative Credentials121 Creative Credentials
121 Creative Credentials
 
5 simple steps to map your visitor journey and optimise your website for conv...
5 simple steps to map your visitor journey and optimise your website for conv...5 simple steps to map your visitor journey and optimise your website for conv...
5 simple steps to map your visitor journey and optimise your website for conv...
 
What Makes A Good Website 2009 Sth Man
What Makes A Good Website   2009 Sth ManWhat Makes A Good Website   2009 Sth Man
What Makes A Good Website 2009 Sth Man
 
UX Tools, Tips & Tricks for Code(Her) Conference 2015
UX Tools, Tips & Tricks for Code(Her) Conference 2015UX Tools, Tips & Tricks for Code(Her) Conference 2015
UX Tools, Tips & Tricks for Code(Her) Conference 2015
 
#VDT - A review of the process. EP. 2
#VDT - A review of the process. EP. 2#VDT - A review of the process. EP. 2
#VDT - A review of the process. EP. 2
 
Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...
Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...
Bulgaria Web Summit 2014 - #VDT - Visual Design Thinking - a review for the p...
 
Bulgaria Web Summit #VDT Visual Design Thinking
Bulgaria Web Summit #VDT Visual Design ThinkingBulgaria Web Summit #VDT Visual Design Thinking
Bulgaria Web Summit #VDT Visual Design Thinking
 
Suckerpunch Portfolio June2010
Suckerpunch Portfolio June2010Suckerpunch Portfolio June2010
Suckerpunch Portfolio June2010
 
Ashton Spann : Portfolio Sample
Ashton Spann : Portfolio SampleAshton Spann : Portfolio Sample
Ashton Spann : Portfolio Sample
 
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
Web Design & Internet Marketing Basics - Brody Dorland, Something Creative, Inc.
 

Recently uploaded

Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksSoftradix Technologies
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAzure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAndikSusilo4
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024Scott Keck-Warren
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsMemoori
 
Pigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machinePadma Pradeep
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxKatpro Technologies
 
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | DelhiFULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhisoniya singh
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersThousandEyes
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024Rafal Los
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking MenDelhi Call girls
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationSafe Software
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsMaria Levchenko
 
Key Features Of Token Development (1).pptx
Key  Features Of Token  Development (1).pptxKey  Features Of Token  Development (1).pptx
Key Features Of Token Development (1).pptxLBM Solutions
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 

Recently uploaded (20)

Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
Benefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other FrameworksBenefits Of Flutter Compared To Other Frameworks
Benefits Of Flutter Compared To Other Frameworks
 
08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
Azure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & ApplicationAzure Monitor & Application Insight to monitor Infrastructure & Application
Azure Monitor & Application Insight to monitor Infrastructure & Application
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024
 
AI as an Interface for Commercial Buildings
AI as an Interface for Commercial BuildingsAI as an Interface for Commercial Buildings
AI as an Interface for Commercial Buildings
 
Pigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping ElbowsPigging Solutions Piggable Sweeping Elbows
Pigging Solutions Piggable Sweeping Elbows
 
Install Stable Diffusion in windows machine
Install Stable Diffusion in windows machineInstall Stable Diffusion in windows machine
Install Stable Diffusion in windows machine
 
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptxFactors to Consider When Choosing Accounts Payable Services Providers.pptx
Factors to Consider When Choosing Accounts Payable Services Providers.pptx
 
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | DelhiFULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
FULL ENJOY 🔝 8264348440 🔝 Call Girls in Diplomatic Enclave | Delhi
 
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for PartnersEnhancing Worker Digital Experience: A Hands-on Workshop for Partners
Enhancing Worker Digital Experience: A Hands-on Workshop for Partners
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
Neo4j - How KGs are shaping the future of Generative AI at AWS Summit London ...
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men08448380779 Call Girls In Greater Kailash - I Women Seeking Men
08448380779 Call Girls In Greater Kailash - I Women Seeking Men
 
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time AutomationFrom Event to Action: Accelerate Your Decision Making with Real-Time Automation
From Event to Action: Accelerate Your Decision Making with Real-Time Automation
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
Key Features Of Token Development (1).pptx
Key  Features Of Token  Development (1).pptxKey  Features Of Token  Development (1).pptx
Key Features Of Token Development (1).pptx
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 

The Top Left Design Design Process

  • 1.
  • 2.
  • 3. We ask questions about your brand, your audience, your key messages, what people believe about you now, what you want them to believe. We ask about your competitors and your design preferences. And more questions! First, we meet face to face, unless you are in another country!
  • 4. And then, once we have gotten to know you, we get you to fill out our amazing design briefing questionnaire We need info
  • 5. It’s easy, don’t worry. You just answer the questions.
  • 6. When we design websites, we start with 2-3 different initial homepage concepts, all based on the design brief and what we have learned about you! Then we work on “look and feel” designs
  • 7. You need to see and love your design before we build it.
  • 8. Here are three concepts for our client, a restaurant in Clapham. You can tell they are all the same company but the layouts are different. Example: Carmen Bar de Tapas
  • 9.
  • 10.
  • 11.
  • 12. In that meeting we did a “live design session”. This one involved radical variations, an exciting session where we combined elements of the 3 initial designs to make a completely new 4th design, which our client signed off. Check it out (see next slide!) Once we showed those first three designs we had our client from Carmen Bar de Tapas in for a design presentation meeting
  • 13.
  • 14. By involving you in the “live design session” we combine our expertise with your input and knowledge of your business and clients. “Live Design Session” Involve You
  • 15. The next example shows a wedding planner. In her brief she asked for a luxury feel and specified a dark background. So, we showed 2 concepts with a dark background, and one design with a light background. Example: Flutterfly Events
  • 16.
  • 17.
  • 18.
  • 19. Then we had the client in for our “live design session” and in that session, we came up with this design:
  • 20.
  • 21. As you can see it’s a light background image! But to be sure, we reminded our client that she had originally specified a dark background, and showed her this in the same “live design session” – to be sure!
  • 22.
  • 23. She went home to think about it, and decided on the light background one!
  • 24.
  • 25. So, one she signed off the design for the homepage we designed each inner page – every page is designed according to the purpose of that page.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31. As you can see there is consistency in the header, footer, positioning of the navigation and the footer design, but the content area of the page differs. We do this with all our bespoke designed sites.
  • 32. This website has all the makings of a high end professional hairdressing salon – but with added personality! The salon owners have 2 dogs who feature on the site – as do all the stylists on a very comprehensive teampage. Each page is different. Example: Kell Skött Haircare
  • 33.
  • 34.
  • 35. Popup windows on each of the team bios show who works at the salon.
  • 36.
  • 37.
  • 38.
  • 39. The rest of the site is very informative and builds confidence and trust.
  • 40.
  • 41.
  • 42.
  • 43. Kell Skött also has a strong social media presence, which is core to their marketing activities.
  • 44.
  • 45.
  • 46. We also design for tablets and phones. Consider how many of your audience are using their phones or mobile devices to visit your website, see your social media posts, read your blogs, speak to you on social media. The following slides show one of our clients, Aspire Leadership – and how their site looks in a browser – and on a mobile phone.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52. Another example – Astute Property Search – you can see how his site looks in a browser, and then on an iPhone.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57. Sometimes we create single page sites – see some examples:
  • 58.
  • 59.
  • 60. The next few slides show how a single page site can have a “content slider” – where different images and text either fade into each other or slide between each other, in the same place.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65.
  • 66.
  • 67. On a single page site, you can use a slider to show a number of images and key messages. To see it in action, visit www.unconventional.sg
  • 68. And more often than not, we design blogs into the website. This works best when it’s seamless – the blog is a part of the website, and doesn’t open up in a new window. We love blogs.
  • 69.
  • 70.
  • 71.
  • 72.
  • 73.
  • 74.
  • 75. Integrate the blog into your website Plan content ahead of time Watch your formatting Always include a picture Post regularly Think of amazing headlines Share your posts on social media Superblogging tips
  • 76. Visit our website: www.topleftdesign.com to ask us any questions. We are very nice and friendly!

Editor's Notes

  1. A sure fire method of ensuring you love your website's design
  2. For this client we presented 3 different designs – this is design 1
  3. This is design 2
  4. This is design 3 – and the final one can be seen http://carmenbardetapas.com/
  5. Another example – 1st of the 3 designs we showed
  6. 2nd design
  7. 3rd design
  8. This was the end result after our “Live Design Session”
  9. We also showed a reversed out version. She chose the light background one though.
  10. You can see the final site: http://www.flutterflyevents.com
  11. - Blogging – creating a content hub on your site