SlideShare a Scribd company logo
Order in the
kitchen
By Fred Moritz
#YDW
2 agreements
#YDW
Fred’s stats
#YDW
Level 22 in life
Planet earth, sector Estonia
24/7 designer:
Work, hobbies, fun
Personal motivation – developing in the field of
design
Deals in mobile, web, print & UI/UX, gamification
Research
#YDW
Personas
#YDW
Up to date trends
#YDW
Visual planning
and organizing.
#YDW
User Flow
Storyboard
User Story
Acceptance Criteria
Scrum (simplified)
Sitemap
DoGo mapping
#YDW
Every minute you spendin planning saves10
minutes in execution
#YDW
―― Brian Tracy
Why kitchen?
#YDW
Design and kitchen – preparations
are important. You should have
everything ready before you start
„cooking“ your design.
Let’s get planning with..
#YDW
User Flow
#YDW
Aka the user journey. It’s the path an
user follows through your website to
complete a task, like making a
purchase or subscribing to a
newsletter.
Where to begin?
User Flow
#YDW
Entry point – an user comes from
google, direct link, paid advertising,
social media, blog post.
How they end on up on your site
determines their needs and they
need to be treated differently.
Example
#YDW
User sees a paid image
advertisment on facebook about a
new phone.
User clicks on ad and lands on the
landing page
User is easily able to make a
purchase from the landing page.
Example
#YDW
Design your site for flow
#YDW
Have clear goals you wish your
users to reach.
Test.
Storyboards
#YDW
Another way of visualizing
Storyboards
#YDW
User Story
#YDW
A user story is a short description of somethingthat your
customer will do whenthey come to yourwebsite, focused on
thevalue or result they get from doing thisthing.
User Story
#YDW
written from thepoint of view of a person using your website or
application
User Story
#YDW
User stories should be written at the
beginning of your project, before you start
making any decisions about technical
solutions or design. Once they’re written
they should be prioritized, from most
important to your customer to least
important.
Acceptance criteria
#YDW
Acceptance criteria are the requirements
that have to be met for a story to be
assessed as complete.
Acceptance criteria
#YDW
Define the boundaries for a user story or a
feature.
Help the team gain a shared
understanding of the story.
Help designers know when
to stop adding more functionality.
Sitemap
#YDW
Is a list of pages accessible for users.
Sitemap
#YDW
Why you should sitemap
#YDW
It’s a centralized planning tool that can help
organize and clarify the content that needs to be
on your site, as well as help you eliminate
unnecessary pages.
Helps avoid dublicate pages on your site
Gets everyone on the same page.
DoGo mapping
#YDW
Name: the name of the view
Do: actions for the view
Go: where you can go from this view
Example
#YDW
SCRUM (simplified)
#YDW
Brainstorming
#YDW
Don’t filter anything
Write down everything
Limit your brainstorm by time
Example
Brainstorming
#YDW
Thoughts on a shoe store.
Brainstorming
#YDW
Thoughts on a shoe store.
Huge call to action BUY button, HERO,
grids, payment options visualised, log in,
fancy images of fancy shoes, color pink, etc.
Must have / nice to have
#YDW
Must have / nice to have
#YDW
MustHave
Everything your site
cannot exist without
Main goal should be
reflected here. If it is
getting money, write it
down!
NiceToHave
Details which would
boost the site but
are not neccessary
in the current
moment.
#YDW
Prioritizing
#YDW
Prioritize the tags and start from the top
Make a site you would love to
use yourself
#YDW
ASSIGNMENT
Select any of these previously
mentioned methods and plan
your website.
Google for:
Scrum, DoGo mapping, user
flow, user story, sitemap.
#YDW

More Related Content

Similar to Your Design Works - Order in the kitchen - plan your website.

Shaping Organizations to Deliver Great User Experiences
Shaping Organizations to Deliver Great User ExperiencesShaping Organizations to Deliver Great User Experiences
Shaping Organizations to Deliver Great User Experiences
Peter Merholz
 
Goal-Driven Design: A Bauhaus Approach to Digital Strategy
Goal-Driven Design: A Bauhaus Approach to Digital StrategyGoal-Driven Design: A Bauhaus Approach to Digital Strategy
Goal-Driven Design: A Bauhaus Approach to Digital Strategy
Purple, Rock, Scissors
 
GDSC IIIT Vadodara Intro Session.pptx
GDSC IIIT Vadodara Intro Session.pptxGDSC IIIT Vadodara Intro Session.pptx
GDSC IIIT Vadodara Intro Session.pptx
VedVekhande
 
User experience workshop
User experience workshopUser experience workshop
User experience workshop
GYK Antler
 
Web and-mobile-trends-2013
Web and-mobile-trends-2013Web and-mobile-trends-2013
Web and-mobile-trends-2013
boypotay
 
Web and mobile trends 2013
Web and mobile trends 2013Web and mobile trends 2013
Web and mobile trends 2013
Jessie Doan
 
Design Learnings
Design LearningsDesign Learnings
Design Learnings
Quikr
 
Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3
Eduardo Wydler
 
Agile Ucd
Agile UcdAgile Ucd
Agile Ucd
supriyaajmera
 
GV Design Sprints for Engineers
GV Design Sprints for EngineersGV Design Sprints for Engineers
GV Design Sprints for Engineers
Peter Collins
 
AgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landis
AgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landisAgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landis
AgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landis
Dave Landis
 
Web Design Core Concepts
Web Design Core ConceptsWeb Design Core Concepts
Web Design Core Concepts
Don Stanley
 
Orientation 2022-23.pdf
Orientation 2022-23.pdfOrientation 2022-23.pdf
Orientation 2022-23.pdf
GoogleDeveloperStude10
 
When we design together
When we design togetherWhen we design together
When we design together
Thoughtworks
 
Marketers Unbound Summit – Intro to Groundforce Digital
Marketers Unbound Summit – Intro to Groundforce DigitalMarketers Unbound Summit – Intro to Groundforce Digital
Marketers Unbound Summit – Intro to Groundforce Digital
Chris Cowperthwaite
 
StoriesOnBoard - a story of a SaaS product from the idea till market launch
StoriesOnBoard - a story of a SaaS product from the idea till market launchStoriesOnBoard - a story of a SaaS product from the idea till market launch
StoriesOnBoard - a story of a SaaS product from the idea till market launch
Árpád Tamás
 
Info Session 2.0 GDSC IIIT-N
Info Session 2.0 GDSC IIIT-NInfo Session 2.0 GDSC IIIT-N
Info Session 2.0 GDSC IIIT-N
GoogleDeveloperStude13
 
Evolving the Creative Process
Evolving the Creative ProcessEvolving the Creative Process
Evolving the Creative Process
creed
 
Command capabilities 2014_1
Command capabilities 2014_1Command capabilities 2014_1
Command capabilities 2014_1
PJ_Moore
 
Top Three Modern Product Trends
Top Three Modern Product TrendsTop Three Modern Product Trends
Top Three Modern Product Trends
Jeremy Johnson
 

Similar to Your Design Works - Order in the kitchen - plan your website. (20)

Shaping Organizations to Deliver Great User Experiences
Shaping Organizations to Deliver Great User ExperiencesShaping Organizations to Deliver Great User Experiences
Shaping Organizations to Deliver Great User Experiences
 
Goal-Driven Design: A Bauhaus Approach to Digital Strategy
Goal-Driven Design: A Bauhaus Approach to Digital StrategyGoal-Driven Design: A Bauhaus Approach to Digital Strategy
Goal-Driven Design: A Bauhaus Approach to Digital Strategy
 
GDSC IIIT Vadodara Intro Session.pptx
GDSC IIIT Vadodara Intro Session.pptxGDSC IIIT Vadodara Intro Session.pptx
GDSC IIIT Vadodara Intro Session.pptx
 
User experience workshop
User experience workshopUser experience workshop
User experience workshop
 
Web and-mobile-trends-2013
Web and-mobile-trends-2013Web and-mobile-trends-2013
Web and-mobile-trends-2013
 
Web and mobile trends 2013
Web and mobile trends 2013Web and mobile trends 2013
Web and mobile trends 2013
 
Design Learnings
Design LearningsDesign Learnings
Design Learnings
 
Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3Understanding Product Design UX / UI / v.3
Understanding Product Design UX / UI / v.3
 
Agile Ucd
Agile UcdAgile Ucd
Agile Ucd
 
GV Design Sprints for Engineers
GV Design Sprints for EngineersGV Design Sprints for Engineers
GV Design Sprints for Engineers
 
AgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landis
AgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landisAgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landis
AgileUX, Lean Start Up, Design Thinking and how it all aligns - dave landis
 
Web Design Core Concepts
Web Design Core ConceptsWeb Design Core Concepts
Web Design Core Concepts
 
Orientation 2022-23.pdf
Orientation 2022-23.pdfOrientation 2022-23.pdf
Orientation 2022-23.pdf
 
When we design together
When we design togetherWhen we design together
When we design together
 
Marketers Unbound Summit – Intro to Groundforce Digital
Marketers Unbound Summit – Intro to Groundforce DigitalMarketers Unbound Summit – Intro to Groundforce Digital
Marketers Unbound Summit – Intro to Groundforce Digital
 
StoriesOnBoard - a story of a SaaS product from the idea till market launch
StoriesOnBoard - a story of a SaaS product from the idea till market launchStoriesOnBoard - a story of a SaaS product from the idea till market launch
StoriesOnBoard - a story of a SaaS product from the idea till market launch
 
Info Session 2.0 GDSC IIIT-N
Info Session 2.0 GDSC IIIT-NInfo Session 2.0 GDSC IIIT-N
Info Session 2.0 GDSC IIIT-N
 
Evolving the Creative Process
Evolving the Creative ProcessEvolving the Creative Process
Evolving the Creative Process
 
Command capabilities 2014_1
Command capabilities 2014_1Command capabilities 2014_1
Command capabilities 2014_1
 
Top Three Modern Product Trends
Top Three Modern Product TrendsTop Three Modern Product Trends
Top Three Modern Product Trends
 

Recently uploaded

Value based approach to heritae conservation -.docx
Value based approach to heritae conservation -.docxValue based approach to heritae conservation -.docx
Value based approach to heritae conservation -.docx
JIT KUMAR GUPTA
 
一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理
一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理
一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理
xnhwr8v
 
欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】
欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】
欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】
bljeremy734
 
一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理
一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理
一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理
kohd1ci2
 
一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理
一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理
一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理
stgq9v39
 
一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理
一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理
一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理
p74xokfq
 
Rethinking Kållered │ From Big Box to a Reuse Hub: A Transformation Journey ...
Rethinking Kållered │  From Big Box to a Reuse Hub: A Transformation Journey ...Rethinking Kållered │  From Big Box to a Reuse Hub: A Transformation Journey ...
Rethinking Kållered │ From Big Box to a Reuse Hub: A Transformation Journey ...
SirmaDuztepeliler
 
一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理
一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理
一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理
k4krdgxx
 
一比一原版(UW毕业证书)华盛顿大学毕业证如何办理
一比一原版(UW毕业证书)华盛顿大学毕业证如何办理一比一原版(UW毕业证书)华盛顿大学毕业证如何办理
一比一原版(UW毕业证书)华盛顿大学毕业证如何办理
i990go7o
 
一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理
一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理
一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理
02tygie
 
World trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORT
World trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORTWorld trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORT
World trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORT
deekshithmaroli666
 
一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理
一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理
一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理
f22b6g9c
 
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理
340qn0m1
 
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
qbydc
 
一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理
一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理
一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理
ka3y2ukz
 
一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理
一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理
一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理
zv943dhb
 
一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理
一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理
一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理
ubogumo
 
一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理
一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理
一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理
t34zod9l
 
一比一原版(UC毕业证书)堪培拉大学毕业证如何办理
一比一原版(UC毕业证书)堪培拉大学毕业证如何办理一比一原版(UC毕业证书)堪培拉大学毕业证如何办理
一比一原版(UC毕业证书)堪培拉大学毕业证如何办理
wkip62b
 
Plastic Molding Infographic - RPWORLD.pdf
Plastic Molding Infographic - RPWORLD.pdfPlastic Molding Infographic - RPWORLD.pdf
Plastic Molding Infographic - RPWORLD.pdf
RPWORLD Manufacturing
 

Recently uploaded (20)

Value based approach to heritae conservation -.docx
Value based approach to heritae conservation -.docxValue based approach to heritae conservation -.docx
Value based approach to heritae conservation -.docx
 
一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理
一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理
一比一原版(falmouth毕业证书)法尔茅斯大学毕业证如何办理
 
欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】
欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】
欧洲杯足彩-欧洲杯足彩比赛投注-欧洲杯足彩比赛投注官网|【​网址​🎉ac10.net🎉​】
 
一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理
一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理
一比一原版(ECU毕业证)澳洲埃迪斯科文大学毕业证如何办理
 
一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理
一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理
一比一原版(CSUEB毕业证)美国加州州立大学东湾分校毕业证如何办理
 
一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理
一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理
一比一原版(USQ毕业证书)南昆士兰大学毕业证如何办理
 
Rethinking Kållered │ From Big Box to a Reuse Hub: A Transformation Journey ...
Rethinking Kållered │  From Big Box to a Reuse Hub: A Transformation Journey ...Rethinking Kållered │  From Big Box to a Reuse Hub: A Transformation Journey ...
Rethinking Kållered │ From Big Box to a Reuse Hub: A Transformation Journey ...
 
一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理
一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理
一比一原版(Deakin毕业证书)澳洲迪肯大学毕业证文凭如何办理
 
一比一原版(UW毕业证书)华盛顿大学毕业证如何办理
一比一原版(UW毕业证书)华盛顿大学毕业证如何办理一比一原版(UW毕业证书)华盛顿大学毕业证如何办理
一比一原版(UW毕业证书)华盛顿大学毕业证如何办理
 
一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理
一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理
一比一原版美国加州大学欧文分校毕业证(UCI学位证)如何办理
 
World trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORT
World trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORTWorld trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORT
World trade center in kerala proposal- AR. DEEKSHITH MAROLI 724519251008 REPORT
 
一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理
一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理
一比一原版(UoN毕业证书)纽卡斯尔大学毕业证如何办理
 
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理
一比一原版(LSE毕业证书)伦敦政治经济学院毕业证如何办理
 
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
 
一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理
一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理
一比一原版(Brunel毕业证)英国布鲁内尔大学毕业证如何办理
 
一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理
一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理
一比一原版(UCB毕业证)英国伯明翰大学学院毕业证如何办理
 
一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理
一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理
一比一原版(lu毕业证书)英国拉夫堡大学毕业证如何办理
 
一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理
一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理
一比一原版(UWS毕业证)澳洲西悉尼大学毕业证如何办理
 
一比一原版(UC毕业证书)堪培拉大学毕业证如何办理
一比一原版(UC毕业证书)堪培拉大学毕业证如何办理一比一原版(UC毕业证书)堪培拉大学毕业证如何办理
一比一原版(UC毕业证书)堪培拉大学毕业证如何办理
 
Plastic Molding Infographic - RPWORLD.pdf
Plastic Molding Infographic - RPWORLD.pdfPlastic Molding Infographic - RPWORLD.pdf
Plastic Molding Infographic - RPWORLD.pdf
 

Your Design Works - Order in the kitchen - plan your website.