From customer need
to Umbraco setup
Hello!
We are René and Anders from Skybrud.dk
Photo from Flickr by Gabriel Chmielewski/Mays Communications
People don't want a drilling
machine, they want a hole in
the wall
,,
Philip Kotler, marketing guru
We help people define, design and develop
holes (nothing naughty about that).
This is what we will talk about today.
Contact
Initial requirementspecification
Financialestimate
Tender
Contract
Pre project fase
Project fase
Workshop/briefing
IA/Wireframing/UX
Design,revisonandfinalaccept
Prototyping
Programming
Education
Dataentry
Technicaltests
Launch
Requirementspecification/
specificationofbacklog
Hosting
Support
Newjobs
Visionseminar
Redesign
Post project fase
• Breaking the project down makes it easier to grasp
• They only have to put their attention to one thing at a time
• They can allocate the right people at the right time in the project
The process is good for our customers because:
• Breaking the project down makes it easier to grasp
• We avoid mixing pears and bananas
→ makes it easier to define the problem if iteration is needed
• It is easier to code something that is well-defined – and we also avoid
coding stuff that ends up being useless or not being used at all
The process is good for us because:
Defining the “hole” begins with questions
• Why – the main purpose
• Who – the users
• What – content, services
• How – concept, system platform, technical setup
• Where – context, devices
• How much – goals
Why
“We want a website!”
→ “Why do you want a website?”
BusinessPotential
Solution
PossibilitiesHow
Why
How do we find the WHY and the potential?
Inside out – looking at the business from both a management
and employee perspective
• Top down → getting “the why” of the solution connected with
the overlying business goals
• Buttom up → getting an idea of what kind of resources
we have to walk the walk
• Looking at the company's vision with “digital eyes”
• Breaking down their strategy/strategies
(sometimes we also help writing them)
• Workshops
• Interviews with employees and sometimes other stakeholders
• Looking at what similar firms in the business are doing
We do this by …
Who
The more you know
about the customers,
the better you can serve them.
The better you serve them,
the more money you make.
CustomersNeeds
Solution
PossibilitiesHow
What
Finding the needs
• Outside in –
looking at the business and services through the lens of the users.
Statistics
Quantitative knowledge, overall level
(can also be at a very specific level if needed)
Output:
• Knowledge about the users and their behavior
• Provides us with an overview of the content and functionality to pursue and
the content to be removed or downgraded
Heatmaps
Quantitative knowledge, overall level
Output:
• Knowledge about the users’ behaviour
• Provides us with an overview of the content and functionality that makes
sense to pursue and what content is to be removed or downgraded
Ask the users
For example a questionnaire on the website.
Both quantitative and qualitative knowledge at an overall level.
Output:
• Knowledge about the users
• What works now and what can we do better
• Inputs to functionality and content
Photo from www.scout.org
Talk with the users
For example focus group interviews / workshops.
Qualitative knowledge on a deep level.
Output:
• Knowledge about the users
• Inputs to functionality and content
• Testing ideas and concepts
WHY (potential)
+ WHO (needs)
= HOW and WHAT
(the solution)
Business Potential
Solution
CustomersNeeds
=
→
Breaking it down
from why + who
how + what (and back again)
Main purpose
Underlying purposeUnderlying purpose Underlying purpose
Underlying purpose Underlying purpose
Solution/featureSolution/feature
Solution/feature
Solution/feature
Solution/featureSolution/feature
How
Main purpose
Underlying purposeUnderlying purpose Underlying purpose
Underlying purpose Underlying purpose
Solution/featureSolution/feature
Solution/feature
Solution/feature
Solution/featureSolution/feature
Why
Main purpose
Underlying purposeUnderlying purpose Underlying purpose
Underlying purpose Underlying purpose
Solution/featureSolution/feature
Solution/feature
Solution/feature
Solution/featureSolution/feature
Why
The “so-ein-ding-muss-ich-auch-haben”-killer
And in the real world
We are doing this in Gliffy.
– sorry folks, but only in danish
Zooming in
Create an efficient, attractive and "daring" website that ensures value both for
Slagelse municipality and the users
➡ Slagelse.dk must increase the possibility of effective self-management among the users
(citizens and businesses) in their interaction with the municipality.
➡ Ensure that all necessary and relevant information is available to the users
(citizens and businesses)
➡ Increase the quality of the content
➡ Feedback from the users
➡ Rating + comments on pages
→
Transforming the knowledge in the diagram
into a product backlog
Description of page layouts including
knowledge about data/content, functionality
and most wanted action.
We are doing this in Basecamp.
From customer need to Umbraco setup
Also descriptions of each function
From customer need to Umbraco setup
From product backlog
to design of the creative
potential
Bring in the gimps!
The gimps
– this is a team
discipline
Paper and pencil
– the fastest way to work with ideas
Reusing ideas
by making them fit the customer
From customer need to Umbraco setup
… but Slagelse
wanted something a
bit different.
They also wanted it to be a
visible element on the page.
Paper and pencil
– also the fastest way to show and communicate these ideas
= handmade wireframes shown in the browser
Right now we are using Moqups for this.
Flesh and blood
– design of the final user interface
We still believe that the best design is created in Photoshop
– but must always be tweaked, presented and approved in a browser.
And a solution for
mobile must always be
experienced on a mobile
Translating to
“programmer-lingo”
Making it user-friendly for the editors
= setting the backend up with the customer
• It’s easy to create backoffice “on the run” with the customer
• Involving the customer
• Getting a lot of clarification done very quickly (no iterations)
• Customers feel ownership
The “you need” toolbox
1 brain Multiple gimp brains
Gliffy
Basecamp
Paper and pencil
Photoshop and a browser
Google Docs
Umbraco
Umbraco is good at
making beautiful holes
– and then you also get
an excellent drilling machine
Umbraco rocks – so let’s drill away!
Anders Bruun / abruun@skybrud.dk
René Pjengaard / rpjengaard@skybrud.dk / @pjengaard

More Related Content

PDF
Do Some UX On It
PPT
Agile and Design Thinking at IBM
PPT
Best Practices: Landing Pages
PDF
IBM Design Thinking with z/OS Communications Server
PDF
Designing At Scale: IBM & MURAL
PDF
Introduction to software design
PPTX
Why your product team should use User Story Mapping to link user research to ...
PPTX
The roi of good user experience SDC 2013
Do Some UX On It
Agile and Design Thinking at IBM
Best Practices: Landing Pages
IBM Design Thinking with z/OS Communications Server
Designing At Scale: IBM & MURAL
Introduction to software design
Why your product team should use User Story Mapping to link user research to ...
The roi of good user experience SDC 2013

What's hot (19)

PDF
UX STRAT Europe 2017: David Ruiz, "Developing a Multi-Channel Banking Experie...
PDF
Becoming A User Advocate
PPT
Introduction to Service Design
PPTX
Discovery 101
PPTX
WHY Map Your Job!
PDF
Spreading Design Thinking in Organizations
PDF
Design-At-Scale-AIGA-Orange-County-pdf
PDF
IBM Design Thinking Case Story
PPTX
Map Your Job! Core Instructions Slides
PPTX
Full stack prototyping
PDF
Think product workshop at J. Boye 14, awaken the Steve Jobs in you
PDF
What to build next
PDF
UXSG2014 Lightning Talks - Applying Lean UX in designing enterprise software ...
PDF
User-centric design for large enterprises
PDF
Level III PP Special @ Shoubii
PDF
Design for Business Impact - Increase Your ROI & Velocity
PDF
IBM Design Thinking field guide
PDF
How To Build A Mobile App - From Ideation to Launch
PDF
Visualizing & Creating High-Performance Customer-Centric Design
UX STRAT Europe 2017: David Ruiz, "Developing a Multi-Channel Banking Experie...
Becoming A User Advocate
Introduction to Service Design
Discovery 101
WHY Map Your Job!
Spreading Design Thinking in Organizations
Design-At-Scale-AIGA-Orange-County-pdf
IBM Design Thinking Case Story
Map Your Job! Core Instructions Slides
Full stack prototyping
Think product workshop at J. Boye 14, awaken the Steve Jobs in you
What to build next
UXSG2014 Lightning Talks - Applying Lean UX in designing enterprise software ...
User-centric design for large enterprises
Level III PP Special @ Shoubii
Design for Business Impact - Increase Your ROI & Velocity
IBM Design Thinking field guide
How To Build A Mobile App - From Ideation to Launch
Visualizing & Creating High-Performance Customer-Centric Design
Ad

Viewers also liked (20)

PDF
Rcbks bulletin vol 18 no 38
PDF
Rcbks bulletin vol 19 no 8
DOCX
The indiscipline of corruption
DOC
SBC Corporation - Announcement On Litigation
PDF
theexpat-march-2012
PDF
Low budget teater_samlet
PPTX
Food and Cancer: What is the story?
PDF
Volume 18. Number 5.
PDF
Annual Report 2005 965kb
PDF
Bib no budget_præs
PDF
Rcbks bulletin vol 19 no 3
PDF
Lampara Tortuga
PDF
Rcbks bulletin vol 18 no 33
PDF
Telegraph Online: 27.12.12
PDF
Rcbks bulletin vol 19 no 6
PDF
theexpat-february-2012
PDF
Rcbks bulletin vol 19 no 4
PDF
6 pa facebook
PPTX
Pazarlamahatalari
DOCX
The indiscipline of corruption
Rcbks bulletin vol 18 no 38
Rcbks bulletin vol 19 no 8
The indiscipline of corruption
SBC Corporation - Announcement On Litigation
theexpat-march-2012
Low budget teater_samlet
Food and Cancer: What is the story?
Volume 18. Number 5.
Annual Report 2005 965kb
Bib no budget_præs
Rcbks bulletin vol 19 no 3
Lampara Tortuga
Rcbks bulletin vol 18 no 33
Telegraph Online: 27.12.12
Rcbks bulletin vol 19 no 6
theexpat-february-2012
Rcbks bulletin vol 19 no 4
6 pa facebook
Pazarlamahatalari
The indiscipline of corruption
Ad

Similar to From customer need to Umbraco setup (20)

PDF
GDG Cloud Southlake #19: Sullivan and Schuh: Design Thinking Primer: How to B...
PPSX
Innovation with Rapid Application Delivery
PPTX
Leveraging Cloud Technologies to Boost Your Start Up
PPT
PCC2 - How do I incorporate Apple-like design into my products?
PDF
UX in Action: IBM Watson
PDF
A dive into DESIGN THINKING – Making products and services that people want
PDF
Discovery Phase: Planing Your Web Project
PDF
Building Shared Understanding Glenn McClure
PDF
Transforming Digital Government Services Workshop - Tuesday 21st October
PDF
An Engineer’s Essential Tool in Agile: Design Thinking
PDF
Lean web solutions with WordPress [English version]
PDF
Agile UX: Embrace or Tolerate
PPTX
Design Thinking: A Common Sense Process
PDF
IT Executive's Guide to Design thinking | Algarytm
PDF
Agile thinking and building the right thing
PPT
The less-discussed benefits of discovery workshops.ppt
PPTX
Why your product team should use User Story Mapping to link user research to ...
PDF
IT Executive's guide to Design Thinking
PPTX
Applying lean ux in designing enterprise software from ground up
PDF
Software Product Engineering
GDG Cloud Southlake #19: Sullivan and Schuh: Design Thinking Primer: How to B...
Innovation with Rapid Application Delivery
Leveraging Cloud Technologies to Boost Your Start Up
PCC2 - How do I incorporate Apple-like design into my products?
UX in Action: IBM Watson
A dive into DESIGN THINKING – Making products and services that people want
Discovery Phase: Planing Your Web Project
Building Shared Understanding Glenn McClure
Transforming Digital Government Services Workshop - Tuesday 21st October
An Engineer’s Essential Tool in Agile: Design Thinking
Lean web solutions with WordPress [English version]
Agile UX: Embrace or Tolerate
Design Thinking: A Common Sense Process
IT Executive's Guide to Design thinking | Algarytm
Agile thinking and building the right thing
The less-discussed benefits of discovery workshops.ppt
Why your product team should use User Story Mapping to link user research to ...
IT Executive's guide to Design Thinking
Applying lean ux in designing enterprise software from ground up
Software Product Engineering

More from Skybrud.dk (7)

PDF
Low budget teater_samlet
PDF
Måling facebook
PDF
Klik og mål
PDF
Tanker om kommunikation
PDF
Facebook Annoncer Skybrud.dk
PDF
Sociale Medier Skybrud.dk
PDF
Tillykke med fødselsdagen Umbraco
Low budget teater_samlet
Måling facebook
Klik og mål
Tanker om kommunikation
Facebook Annoncer Skybrud.dk
Sociale Medier Skybrud.dk
Tillykke med fødselsdagen Umbraco

Recently uploaded (20)

PDF
A comparative study of natural language inference in Swahili using monolingua...
DOCX
search engine optimization ppt fir known well about this
PDF
Univ-Connecticut-ChatGPT-Presentaion.pdf
PDF
sustainability-14-14877-v2.pddhzftheheeeee
PDF
Assigned Numbers - 2025 - Bluetooth® Document
PDF
Taming the Chaos: How to Turn Unstructured Data into Decisions
PPT
Module 1.ppt Iot fundamentals and Architecture
PDF
Zenith AI: Advanced Artificial Intelligence
PDF
August Patch Tuesday
PPTX
Benefits of Physical activity for teenagers.pptx
PDF
Five Habits of High-Impact Board Members
PPTX
Tartificialntelligence_presentation.pptx
PDF
NewMind AI Weekly Chronicles – August ’25 Week III
PPTX
O2C Customer Invoices to Receipt V15A.pptx
PDF
Transform Your ITIL® 4 & ITSM Strategy with AI in 2025.pdf
PDF
Hybrid horned lizard optimization algorithm-aquila optimizer for DC motor
PPTX
observCloud-Native Containerability and monitoring.pptx
PDF
WOOl fibre morphology and structure.pdf for textiles
PPTX
Modernising the Digital Integration Hub
PDF
How ambidextrous entrepreneurial leaders react to the artificial intelligence...
A comparative study of natural language inference in Swahili using monolingua...
search engine optimization ppt fir known well about this
Univ-Connecticut-ChatGPT-Presentaion.pdf
sustainability-14-14877-v2.pddhzftheheeeee
Assigned Numbers - 2025 - Bluetooth® Document
Taming the Chaos: How to Turn Unstructured Data into Decisions
Module 1.ppt Iot fundamentals and Architecture
Zenith AI: Advanced Artificial Intelligence
August Patch Tuesday
Benefits of Physical activity for teenagers.pptx
Five Habits of High-Impact Board Members
Tartificialntelligence_presentation.pptx
NewMind AI Weekly Chronicles – August ’25 Week III
O2C Customer Invoices to Receipt V15A.pptx
Transform Your ITIL® 4 & ITSM Strategy with AI in 2025.pdf
Hybrid horned lizard optimization algorithm-aquila optimizer for DC motor
observCloud-Native Containerability and monitoring.pptx
WOOl fibre morphology and structure.pdf for textiles
Modernising the Digital Integration Hub
How ambidextrous entrepreneurial leaders react to the artificial intelligence...

From customer need to Umbraco setup

  • 1. From customer need to Umbraco setup
  • 2. Hello! We are René and Anders from Skybrud.dk
  • 3. Photo from Flickr by Gabriel Chmielewski/Mays Communications People don't want a drilling machine, they want a hole in the wall ,, Philip Kotler, marketing guru
  • 4. We help people define, design and develop holes (nothing naughty about that). This is what we will talk about today.
  • 8. • Breaking the project down makes it easier to grasp • They only have to put their attention to one thing at a time • They can allocate the right people at the right time in the project The process is good for our customers because:
  • 9. • Breaking the project down makes it easier to grasp • We avoid mixing pears and bananas → makes it easier to define the problem if iteration is needed • It is easier to code something that is well-defined – and we also avoid coding stuff that ends up being useless or not being used at all The process is good for us because:
  • 10. Defining the “hole” begins with questions • Why – the main purpose • Who – the users • What – content, services • How – concept, system platform, technical setup • Where – context, devices • How much – goals
  • 11. Why
  • 12. “We want a website!” → “Why do you want a website?”
  • 14. How do we find the WHY and the potential? Inside out – looking at the business from both a management and employee perspective • Top down → getting “the why” of the solution connected with the overlying business goals • Buttom up → getting an idea of what kind of resources we have to walk the walk
  • 15. • Looking at the company's vision with “digital eyes” • Breaking down their strategy/strategies (sometimes we also help writing them) • Workshops • Interviews with employees and sometimes other stakeholders • Looking at what similar firms in the business are doing We do this by …
  • 16. Who
  • 17. The more you know about the customers, the better you can serve them. The better you serve them, the more money you make.
  • 19. Finding the needs • Outside in – looking at the business and services through the lens of the users.
  • 20. Statistics Quantitative knowledge, overall level (can also be at a very specific level if needed) Output: • Knowledge about the users and their behavior • Provides us with an overview of the content and functionality to pursue and the content to be removed or downgraded
  • 21. Heatmaps Quantitative knowledge, overall level Output: • Knowledge about the users’ behaviour • Provides us with an overview of the content and functionality that makes sense to pursue and what content is to be removed or downgraded
  • 22. Ask the users For example a questionnaire on the website. Both quantitative and qualitative knowledge at an overall level. Output: • Knowledge about the users • What works now and what can we do better • Inputs to functionality and content
  • 23. Photo from www.scout.org Talk with the users For example focus group interviews / workshops. Qualitative knowledge on a deep level. Output: • Knowledge about the users • Inputs to functionality and content • Testing ideas and concepts
  • 24. WHY (potential) + WHO (needs) = HOW and WHAT (the solution) Business Potential Solution CustomersNeeds
  • 25. = → Breaking it down from why + who how + what (and back again)
  • 26. Main purpose Underlying purposeUnderlying purpose Underlying purpose Underlying purpose Underlying purpose Solution/featureSolution/feature Solution/feature Solution/feature Solution/featureSolution/feature How
  • 27. Main purpose Underlying purposeUnderlying purpose Underlying purpose Underlying purpose Underlying purpose Solution/featureSolution/feature Solution/feature Solution/feature Solution/featureSolution/feature Why
  • 28. Main purpose Underlying purposeUnderlying purpose Underlying purpose Underlying purpose Underlying purpose Solution/featureSolution/feature Solution/feature Solution/feature Solution/featureSolution/feature Why The “so-ein-ding-muss-ich-auch-haben”-killer
  • 29. And in the real world We are doing this in Gliffy. – sorry folks, but only in danish
  • 30. Zooming in Create an efficient, attractive and "daring" website that ensures value both for Slagelse municipality and the users ➡ Slagelse.dk must increase the possibility of effective self-management among the users (citizens and businesses) in their interaction with the municipality. ➡ Ensure that all necessary and relevant information is available to the users (citizens and businesses) ➡ Increase the quality of the content ➡ Feedback from the users ➡ Rating + comments on pages
  • 31. → Transforming the knowledge in the diagram into a product backlog Description of page layouts including knowledge about data/content, functionality and most wanted action. We are doing this in Basecamp.
  • 33. Also descriptions of each function
  • 35. From product backlog to design of the creative potential Bring in the gimps!
  • 36. The gimps – this is a team discipline
  • 37. Paper and pencil – the fastest way to work with ideas
  • 38. Reusing ideas by making them fit the customer
  • 40. … but Slagelse wanted something a bit different.
  • 41. They also wanted it to be a visible element on the page.
  • 42. Paper and pencil – also the fastest way to show and communicate these ideas = handmade wireframes shown in the browser Right now we are using Moqups for this.
  • 43. Flesh and blood – design of the final user interface We still believe that the best design is created in Photoshop – but must always be tweaked, presented and approved in a browser.
  • 44. And a solution for mobile must always be experienced on a mobile
  • 46. Making it user-friendly for the editors = setting the backend up with the customer • It’s easy to create backoffice “on the run” with the customer • Involving the customer • Getting a lot of clarification done very quickly (no iterations) • Customers feel ownership
  • 47. The “you need” toolbox 1 brain Multiple gimp brains Gliffy Basecamp Paper and pencil Photoshop and a browser Google Docs Umbraco
  • 48. Umbraco is good at making beautiful holes – and then you also get an excellent drilling machine
  • 49. Umbraco rocks – so let’s drill away! Anders Bruun / abruun@skybrud.dk René Pjengaard / rpjengaard@skybrud.dk / @pjengaard