Designing from the middle - how we design at Crunch
•Download as PPTX, PDF•
1 like•856 views
Mark Cossey, Head of Design and UX, runs through the design process we use, and how you can employ a similar approach at your startup.
Recommended
Recommended
More Related Content
Similar to Designing from the middle - how we design at Crunch
Similar to Designing from the middle - how we design at Crunch (20)
More from Crunch
More from Crunch (9)
Recently uploaded
Recently uploaded (20)
Designing from the middle - how we design at Crunch
- 1. Designing from the middle integrating design into your tech startup
- 5. Getting the team right
- 6. UX Research / testing UI Design Visual Design Front End Development
- 7. UX Research / testing UI Design Visual Design Front End Development
- 8. Look for versatility “When you can’t change the direction of the wind — adjust your sails” Photo by Duncan - Flickr
- 9. Look for makers and problem solvers “Great talent finds happiness in execution” Photo by WarmSleepy - Flickr
- 10. Look for enthusiasm “The true way to render ourselves happy is to love our work and find it in our pleasure” Photo by skippyjon - Flickr
- 11. Look for ability to challenge “Courage is what it takes to stand up and speak; courage is also what it takes to sit down and listen.” Photo by Scott Ableman - Flickr
- 12. Review CV Telephone chat Pre interview task Interview Coffee sketch activity Post interview review Informal face to face with team lead Offer Review task Review portfolio Interview questions Stage 1 Stage 2 Stage 3 2 weeks
- 13. Working with the business
- 15. Integration Critical to the success of any user experience team is an organization that values its contribution
- 17. Start Early Middle Late Release
- 20. Create a definition statement A concise, concrete declaration of a product, service or features main purpose and its intended audience
- 21. Snap An app for Crunch customers to add expenses with receipts to their account on the go.
- 22. Provide space A space for shared note taking, problem solving and cross team vision sharing Photo by Google Ventures team
- 23. Sketching & rapid prototyping
- 24. Keep testing your prototypes
- 25. Sketch Prototype Test Build
- 26. Ingredients for good design
- 27. Create a strong foundation Photo by sarflondondunc - Flickr
- 28. Style guides
- 29. Atomic design system (for larger applications) Atoms Molecules Organisms Templates Pages From: www.patternlab.io
- 30. Example of an Atom ● Colours ● Fonts ● Buttons Example of a Molecule ● A group of Atoms that function together Example of an organism ● Groups of molecules joined together to form part of the interface
- 31. Example of an Atom ● Colours ● Fonts ● Buttons Example of a Molecule ● A group of Atoms that function together Example of an organism ● Groups of molecules joined together to form part of the interface
- 32. Example of an Atom ● Colours ● Fonts ● Buttons Example of a Molecule ● A group of Atoms that function together Example of an organism ● Groups of molecules joined together to form part of the interface
- 33. Example of a Page
- 34. Example of a Template
- 37. Photo by bdesham - Flickr Why use front end style guides, design systems & principles?
- 38. Photo by Scottish Government - Flickr Everyone can get involved
- 39. Maintain quality & consistency Photo by Dyson
- 40. Understanding Good team Environment Principles & Systems Good practice
- 41. Understanding Good team Environment Principles & Systems Good practice
- 42. Understanding Good team Environment Principles & Systems Good practice
- 43. Understanding Good team Environment Principles & Systems Good practice
- 44. Understanding Good team Environment Principles & Systems Good practice
- 45. Understanding Good team Environment Principles & Systems Good practice Design from the middle
- 46. Photo by sean dreilinger - Flickr Build something amazing
- 47. Thank you Join the Crunch design team www.crunch.co.uk/careers/
Editor's Notes
- Most people in our industry have an answer for this.
- Mostly people talk about the disciplines involved in producing a good ‘user experience’. From information architecture to interaction design - there is plenty to think about. But what does UX and design mean to you and your startup? The disciplines of user experience design by - Dan Saffer
- This is what it means at Crunch.
- To produce a good user experience requires good design and good design requires a good team. A team that can facilitate design thinking for everyone.
- In a lean agile UX environment, these are some of the disciplines that are needed to fulfill the design team deliverables.
- Some of these disciplines overlap so its important roles and deliverables are defined for the benefit of the product design or scrum teams. When you are hiring look out for the following traits.
- We ask our candidates to tell us about projects that didn’t work or how they reacted when scope changed or it was cancelled altogether H. Jackson Brown Junior quote
- Candidates should have a portfolio of work that is able to demonstrate problem solving and clear design journey - not just finished products. Having an interest outside of work that involves making or creating often shows candidates to have the right mindset. Johann Wolfgang von Goethe quote
- Are candidates excited about what they are doing? Are they optimistic about their future? Francoise de Motteville quote
- Candidates should have the confidence and courage to challenge ideas and solutions. They should be comfortable doing this when its necessary. Winston Churchill quote
- A thorough interview process is crucial but don’t draw this out for too long as your candidates might drift. At crunch we aim to turn this around in a couple of weeks.
- So you have a killer team - now integrate them with the business.
- Understand that design touches all parts of your business as it does at Crunch.
- Dedicate each designer exclusively to one particular scrum team for best results. The designer should feel connected to the teams focus and part of the team. This really helps to clarify priorities.
- We follow a 4d design process at Crunch which is inspired by the Double diamond process by The Design Council
- We are agile, we iterate and we improve all the time so the process is on-going. Modified approach to the Design Councils ‘Double Diamond’ process.
- There are steps in the process that we use and while these are not set in stone, they help the team gain a thorough understanding of the problem and explore the best solution.
- It’s important that you define your app, product or service. This helps to share the vision with everyone and solidify who you are. From Apple’s Human Interface Guidelines
- For example
- Provide a space for your team and company to problem solve together. A design wall is perfect. Photo from Google Ventures team
- During our discovery and definition stages we sketch and prototype a lot. I want my team to fail fast and early in the process as well as exploring lots of potential ideas. It allows us to communicate effectively through the product design team too. We use sketch workshops to engage conversation and explore ideas.
- We test our prototypes all the time and use a variety of methods. Test labs certainly have a use for detailed feedback and insight but often simple guerilla or corridor testing will be effective.
- Now what? So now we… Understand what UX is and where it fits in the business Have a kick-ass design team Know how the design team works with other areas of the business
- Guidance on the visual appearance and markup structure of your UI elements
- A system that allows for scale and modularity
- Specifics on the building blocks that form your product will help you to build bigger, better and quicker.
- Agree the ten most important principles for what you consider is good design. 1. We do the numbers Accountancy is at the heart of our service, we love it and we’re good at it. We want our customers to focus on their business while we do the numbers. Our UI should be clear, easy to use and elegant. 2. Help when you need it Our in-house accountants are what make us different. They are there to help and advise our customers and this ethos should be evident in our apps and web content. 3. Larger hit areas Touch points should feel comfortable and easy to use. Inputs, buttons and other form elements should be large enough to use easily on desktop and touch devices. 4. Clear language and tone of voice Our copy should be clear and concise and offer guidance to our users. There should be no surprises or doubt. 5. Consistency Our visual language should be consistent across our marketing channels and UI. By defining typography, colours, contrast, grids, photography and illustrations styles as well our tone of voice and interaction, we create a consistent experience. 6. Shorter journeys Avoid traditional menu navigation or screen-after-screen approaches and strive to make our customers journey short and instant. 7. Atomic Break UI elements down into atoms, molecules, organisms, pages and templates 8. Design, test, iterate Design for the user not for personal taste. Fail fast by testing early and validate your solutions by customer test outcomes. 9. Visual clarity Our content should be clear and easy to understand. This is achieved by correct colour usage, sizing, contrast. 10. Users first Above all we should be designing for our users. Providing functionality that they need and improving functionality that they find difficult to use.
- Understand how user experience design works with your business. Its where the needs of the user, the business goals and technology meet.
- Recruit a good team. Look for problem solvers, makers, people who show versatility and enthusiasm as well as courage to challenge the status quo.
- Create an environment that encourages collaboration, exploration and problem solving. Invite conversation, problem solve on paper (the bigger the better) or even better a design wall. Pair up on design or code tasks.
- Introduce principles and systems that keep you on track. Things like style guides, UI kits, atomic design systems help.
- Put design into practice. Use design processes and principles to solve problems wider in the business. Everyone can design.
- By doing these things you will be designing from the middle so...