{"id":19367,"date":"2020-02-26T01:45:22","date_gmt":"2020-02-26T01:45:22","guid":{"rendered":"https:\/\/marvel7077.wpengine.com\/?p=19367"},"modified":"2020-10-09T10:17:04","modified_gmt":"2020-10-09T09:17:04","slug":"run-first-design-thinking-workshop-prototypes","status":"publish","type":"post","link":"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/","title":{"rendered":"How to Run Your First Design Thinking Workshop Using Marvel"},"content":{"rendered":"<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><script type=\"application\/ld+json\"> {\n  \"@context\": \"https:\/\/schema.org\",\n  \"@type\": \"WebPage\",\n  \"headline\": \"\n            Design Thinking - How to Run Your Own Design Thinking Workshop - Marvel Blog        \",\n  \"about\": [\n    {\"@type\": \"Thing\",\"name\": \"Design Thinking\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Design_thinking\"}, \n    {\"@type\": \"Thing\",\"name\": \"Workshop\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Workshop\"}, \n    {\"@type\": \"Thing\",\"name\": \"design\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Design\"}, \n    {\"@type\": \"Thing\",\"name\": \"blog\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Blog\"}, \n    {\"@type\": \"Thing\",\"name\": \"Thinking\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Cognition\"}\n  ],\n  \"mentions\": [\n    {\"@type\": \"Thing\",\"name\": \"users\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/User_(computing)\"}, \n    {\"@type\": \"Thing\",\"name\": \"experiences\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Experience\"}, \n    {\"@type\": \"Thing\",\"name\": \"prototypes\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Prototype\"}, \n    {\"@type\": \"Thing\",\"name\": \"guide\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/How-to\"}, \n    {\"@type\": \"Thing\",\"name\": \"Product\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/Product_(business)\"}, \n    {\"@type\": \"Thing\",\"name\": \"schools\",\"sameAs\": \"https:\/\/en.wikipedia.org\/wiki\/School\"}\n  ]\n}\n<\/script><br \/>\nDid you know that hundreds of workshops take place around the world every month using Marvel?<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">From schools to enterprises, Marvel has powered workshops of all shapes and sizes. Whether that's meeting rooms with 5 people working on a feature, to halls with over 50 kids learning about Design Thinking.<\/p>\n<div id='gallery-1' class='gallery galleryid-19367 gallery-columns-2 gallery-size-large'><dl class='gallery-item'>\n\t\t\t<dt class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/screenshot-2020-02-25-13-40-14\/'><img loading=\"lazy\" decoding=\"async\" width=\"1000\" height=\"581\" src=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-13.40.14.png\" class=\"attachment-large size-large\" alt=\"Students in a design thinking workshop\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-13.40.14.png 1000w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-13.40.14-600x349.png 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-13.40.14-768x446.png 768w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/a>\n\t\t\t<\/dt><\/dl><dl class='gallery-item'>\n\t\t\t<dt class='gallery-icon landscape'>\n\t\t\t\t<a href='https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/screenshot-2020-02-25-10-38-33-2\/'><img loading=\"lazy\" decoding=\"async\" width=\"1000\" height=\"581\" src=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-10.38.33-1.png\" class=\"attachment-large size-large\" alt=\"Boys doing prototyping on paper\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-10.38.33-1.png 1000w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-10.38.33-1-600x349.png 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Screenshot-2020-02-25-10.38.33-1-768x446.png 768w\" sizes=\"auto, (max-width: 1000px) 100vw, 1000px\" \/><\/a>\n\t\t\t<\/dt><\/dl><br style=\"clear: both\" \/>\n\t\t<\/div>\n\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">The great thing about our workshops is that anyone can run one - whether you're in design, research, marketing or management. We've seen all roles and departments get stuck into running and participating sessions.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Through working with customers and partners over the years, we've taken many of the learnings and included it our very own <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/workshops?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=design%20thinking\">Design Thinking workshop kit<\/a>, with everything you need to run your first session, including digital and print materials.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">This blog post will take you through the basics. download the free kit for further reading, templates and decks.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/workshops\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-19402 size-medium\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_10-600x300.png\" alt=\"Marvel Design Thinking Workshop Kit\" width=\"600\" height=\"300\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_10-600x300.png 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_10-768x384.png 768w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_10-1500x750.png 1500w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_10.png 1728w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">So what is Design Thinking?<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Design Thinking is a design methodology that helps solve problems using a human-centered approach. It's nothing revolutionary mind you, the stages of the process are things you probably already know and do.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">However, when pieced together as a framework, it can be incredibly effective in discovering solutions whilst always putting the end-user first. It\u2019s simple enough for everyone to use and will take you from idea generation, right the way through to sketching, creating and testing interactive prototypes using Marvel.<\/p>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">Let\u2019s break down the stages:<\/h3>\n<ol class=\"pageWrap pageWrap--s list list--ordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li><b class=\"fontWeight-5\">Empathise:<\/b> Know the people you're designing for, so you understand their needs better.<\/li>\n<li><b class=\"fontWeight-5\">Define:<\/b> The big, meaty problem you want to solve for your business, customer or end-user<\/li>\n<li><b class=\"fontWeight-5\">Ideate: <\/b>Come up with different solutions that might be useful to people<\/li>\n<li><b class=\"fontWeight-5\">Prototype: <\/b>Turn ideas into realistic mockups that you can test (and where you use Marvel!)<\/li>\n<li><b class=\"fontWeight-5\">Test:<\/b> Share your prototype and gain invaluable feedback from the people that matter<\/li>\n<\/ol>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Another major benefit (which I love), is that it brings non-designers into the mix. It\u2019s all about the process of putting users and experiences first to unlock the potential of any idea, product or business. Then once every team has the hang of it, they can simply rinse and repeat the same process for new problems that need solving.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Once you\u2019ve defined the problem you\u2019re solving and brainstormed ideas, you\u2019ll need to move onto the prototype stage where you\u2019ll rapidly create a mockup to test your idea with users.<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">So you want to run a workshop? The role of the facilitator.<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Every workshop needs a facilitator to run it (you!) so we've put together a short guide on how to get everything prepped and ready for a successful session.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-19404 size-full\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2020\/02\/Image_01_b@2x.jpg\" alt=\"Workshop facilitator\" width=\"1102\" height=\"832\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Image_01_b@2x.jpg 1102w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Image_01_b@2x-600x453.jpg 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/Image_01_b@2x-768x580.jpg 768w\" sizes=\"auto, (max-width: 1102px) 100vw, 1102px\" \/><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">You'll be responsible for setting up the workshop, sending invites to attendees, printing our workshop kit and keeping everyone engaged and on time as they work through the stages of Empathise, Define, Ideate, Prototype and Testing.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">One facilitator is needed for up to four teams of 3-5 people, if your session is bigger than that, grab someone to give you a hand!<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Don\u2019t worry, we\u2019ve made a list of basics to help you run your session:<\/p>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li><b class=\"fontWeight-5\">Pick a time-frame<\/b> - It typically takes a minimum of 1 hour for a tightly run workshop with 6 people to produce results. If you have more people, increase the time.<\/li>\n<li><b class=\"fontWeight-5\">Choose a theme<\/b> - Each workshop will center around a business or user problem to solve. Pick something flexible enough to generate multiple solutions, for example 'Help more users remember to take their medication'.<\/li>\n<li><b class=\"fontWeight-5\">Email everyone the agenda, download links and plan - <\/b>Let everyone know the what, when and where. Also send out the calendar event and book a meeting room!<\/li>\n<li><b class=\"fontWeight-5\">Download our apps<\/b> - If you\u2019re using whiteboards and paper, ask everyone to download the <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/apps.apple.com\/us\/app\/marvel-app\/id765801658?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=design%20thinking\">Marvel iOS<\/a> or <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/play.google.com\/store\/apps\/details?id=com.marvelapp&amp;hl=en_GB\">Android app<\/a>. If you're working on wireframes or high-fidelity UI and need a design tool, head to Marvel in your browser where you can design in your browser or use Sketch. <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/signup\">Sign up to a free Marvel account<\/a> before the session starts.<\/li>\n<li><b class=\"fontWeight-5\">Download and print the workbook and template sketch paper<\/b> - This has the outline of devices making it easier to draw your screens and take photos using the <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/apps\">Marvel apps<\/a>. Plus it allows the participants to write their responses to each of the stages.<\/li>\n<li><b class=\"fontWeight-5\">Download our presentation guide - <\/b>You can put our presentation on the screen in your meeting room while the workshop is running to keep people on track.<\/li>\n<\/ul>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">During the workshop<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Once things have kicked off, here\u2019s a few tips to make sure it all goes smoothly:<\/p>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li><b class=\"fontWeight-5\">Be strict on the time spent on each stage<\/b> - Time to get vocal! Constantly give everyone updates on how much time is remaining in each stage and usher them to complete the tasks and move on. It also helps build up the energy and suspense for presentations!<\/li>\n<li><b class=\"fontWeight-5\">Use the facilitator deck to keep a steady pace<\/b> - Keep the facilitator slides from\u00a0our kit visible on a TV screen or laptop so that attendees can keep referring back to it. Move through the slides to push everyone into each new stage.<\/li>\n<li><b class=\"fontWeight-5\">Encourage multi-tasking<\/b> - It\u2019s natural for some teams to fall behind the stages, but don\u2019t worry! It\u2019s a great opportunity for other members of the team to tackle a different stage or begin crafting the presentation.<\/li>\n<\/ul>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">What is Marvel and why is it used in Design Thinking?<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Marvel is a design and prototyping platform that enables you to create realistic, interactive mockups of apps, websites and digital products. It\u2019s super simple to use, you can go from idea to clickable prototype in a matter of seconds, and you don\u2019t need to know any code.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Once your session reaches the \u2018Prototype\u2019 stage of Design Thinking, that\u2019s where Marvel comes in. It\u2019s free to sign up and use, all your attendees need to have is an iPhone, Android or laptop device.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvel7077.wpengine.com\/what-is-rapid-prototyping\/\">R<\/a><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvel7077.wpengine.com\/what-is-rapid-prototyping\/?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=prototyping\">apid prototyping<\/a> with Marvel is the best way to test ideas with users and start a conversation is to show them how the solution works. This can range from hand-drawn sketches (low-fidelity) to interactive mockups (high-fidelity) that look and feel like the finished product.<\/p>\n<div id=\"attachment_19386\" style=\"width: 1210px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-19386\" class=\"wp-image-19386 size-full\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2020\/02\/amelie-mourichon-zFcop_22Xo-unsplash.jpg\" alt=\"Prototyping on Paper\" width=\"1200\" height=\"900\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/amelie-mourichon-zFcop_22Xo-unsplash.jpg 1200w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/amelie-mourichon-zFcop_22Xo-unsplash-600x450.jpg 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/amelie-mourichon-zFcop_22Xo-unsplash-768x576.jpg 768w\" sizes=\"auto, (max-width: 1200px) 100vw, 1200px\" \/><p id=\"caption-attachment-19386\" class=\"wp-caption-text\">Photo by <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/unsplash.com\/photos\/sv8oOQaUb-o\">Am\u00e9lie Mourichon<\/a><\/p><\/div>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">The purpose of rapid prototyping is to demonstrate possibilities quickly by building a series of inexpensive mock-ups so that you\u2019re able to get early feedback and adjust designs accordingly.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><strong class=\"c-slate lineHeight-l fontSize-l fontWeight-5 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Tips for getting started:<\/strong><\/p>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li><b class=\"fontWeight-5\">Don\u2019t be too precious about your first idea<\/b><b class=\"fontWeight-5\">: <\/b>In the early stages of ideation, your first few ideas won\u2019t be your best but that\u2019s absolutely fine \u2013 keep focused on generating as many designs as possible.<\/li>\n<li><b class=\"fontWeight-5\">It doesn\u2019t need to be pretty<\/b><b class=\"fontWeight-5\">:<\/b> When creating sketches, it\u2019s always tempting to spend time making them look amazing but it\u2019s best to avoid that and focus instead of getting your ideas down. Remember, you\u2019ll go through a few iterations before you finalise your prototype.<\/li>\n<\/ul>\n<blockquote class=\"pageWrap pageWrap--s position-relative marginTopBottom-l breakPointM-marginTopBottom-xl\"><div class=\"blog-quote-before position-absolute bg-marvel\"><\/div><div class=\"tweet-quote blog-quote-after position-absolute bg-marvel cursor-pointer transitionDuration-l transitionProperty-all transitionTimingFunction-cv-easeOutCircular scaleUp--hover zi-weak\"><svg class=\"fill-white opacity-0 pointerEvents-none position-absolute pinCenter transitionProperty-all transitionTimingFunction-easeInOut\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"24\" height=\"20\" viewBox=\"0 0 24 20\"><path d=\"M24,2.37a9.64,9.64,0,0,1-2.83.79A5,5,0,0,0,23.34.37a9.72,9.72,0,0,1-3.13,1.23A4.86,4.86,0,0,0,16.62,0a5,5,0,0,0-4.8,6.2A13.87,13.87,0,0,1,1.67.92,5.13,5.13,0,0,0,3.19,7.67,4.81,4.81,0,0,1,1,7a5,5,0,0,0,3.95,5,4.82,4.82,0,0,1-2.22.09,4.94,4.94,0,0,0,4.6,3.51A9.72,9.72,0,0,1,0,17.73,13.69,13.69,0,0,0,7.55,20c9.14,0,14.31-7.92,14-15A10.17,10.17,0,0,0,24,2.37Z\"\/><\/svg><\/div><p class=\"blog-quote position-relative textAlign-center c-marvel\"><span class=\"blog-quote-text transitionDuration-l transitionProperty-all transitionTimingFunction-easeInOut\">\u201cThey slow us down to speed us up. By taking the time to prototype our ideas, we avoid costly mistakes such as becoming too complex too early and sticking with a weak idea for too long.\u201d \u2013 Tim Brown, Change by Design<\/p><\/span><\/blockquote>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">But first! Map out your user journey<\/h3>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Before you start prototyping in your session, ask your participants to sketch out the journey you want your user to go through in your product on paper. This doesn't have to be very detailed or technical, it's just to go through the process of create a rough blueprint for how the user will move between screens.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-19385\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2020\/02\/designthinking-journeys.jpg\" alt=\"\" width=\"720\" height=\"400\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/designthinking-journeys.jpg 720w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/designthinking-journeys-600x333.jpg 600w\" sizes=\"auto, (max-width: 720px) 100vw, 720px\" \/><\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">Creating prototypes with Marvel<\/h2>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">How to create mobile prototypes using sketches<\/h3>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Our iPhone and Android apps are perfect for creating prototypes of mobile apps or features in your <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/introducing-design-thinking-workshop-kit\/\">Design Thinking session<\/a>. They allow anyone to turn sketches on paper into interactive prototypes in a few minutes.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><script src=\"https:\/\/fast.wistia.com\/embed\/medias\/mw3opc5ywm.jsonp\" async><\/script><script src=\"https:\/\/fast.wistia.com\/assets\/external\/E-v1.js\" async><\/script><span class=\"wistia_embed wistia_async_mw3opc5ywm popover=true popoverAnimateThumbnail=true\" style=\"display: inline-block; height: 405px; position: relative; width: 720px;\">\u00a0<\/span><\/p>\n<ol class=\"pageWrap pageWrap--s list list--ordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li>Download the <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/apps?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=prototyping\">free Marvel app<\/a> here<\/li>\n<li>Create a project by tapping the green add button in the bottom right of the screen<\/li>\n<li>Write your project name and select your device type<\/li>\n<li>Click the green add button to add images from your camera roll or capture images of your sketches<\/li>\n<li>Select your image and tap \u2018Add Link\u2019 to create a hotspot. Drag and resize your hotspots as necessary<\/li>\n<li>Select \u2018Link to image\u2019 and select where a user would go when they click that hotspot<\/li>\n<li>Customise with transitions between screens<\/li>\n<li>When you\u2019re ready, hit the play button or \u2018Share\u2019 in the top right to share via message, email or URL<\/li>\n<\/ol>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">How to create desktop prototypes<\/h3>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">If your idea or product requires prototypes for desktop screen sizes, the Marvel web platform allows you to wireframe, design and prototype directly in the browser without any additional software. All you need is a laptop or computer. If you use Sketch or other design software, we support that too!<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><script src=\"https:\/\/fast.wistia.com\/embed\/medias\/9o4p3cayd8.jsonp\" async><\/script><script src=\"https:\/\/fast.wistia.com\/assets\/external\/E-v1.js\" async><\/script><span class=\"wistia_embed wistia_async_9o4p3cayd8 popover=true popoverAnimateThumbnail=true\" style=\"display: inline-block; height: 405px; position: relative; width: 720px;\">\u00a0<\/span><\/p>\n<ol class=\"pageWrap pageWrap--s list list--ordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li>Click the <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/projects\/my?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=prototyping\">'Create Project'<\/a> button in the top right of your screen<\/li>\n<li>Select 'Prototype' and enter your Project Name and type of prototype that you'd like to create<\/li>\n<li>Select \u2018Add Images\u2019 and choose to upload from your computer or design in Marvel<\/li>\n<li>Hover over the first screen in your project and click \u2018Prototype\u2019<\/li>\n<li>Click and drag over the area you would like to link to another screen and select your hotspot destination<\/li>\n<li>Select a screen transition and action at the bottom of the hotspot panel<\/li>\n<li>When you\u2019re ready, click 'Play' in the top right of your screen to see your prototype in action or 'Share or invite' to send to your test user<\/li>\n<\/ol>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Now that you have your prototype, you\u2019re able to test with end-users or others in the session, and gain valuable feedback that will help validate your ideas!<\/p>\n<h2 class=\"pageWrap pageWrap--s marginTop-xl marginBottom-l c-black lineHeight-xl fontSize-xl fontWeight-5 breakPointM-lineHeight-xxl breakPointM-fontSize-xxl\" style=\"margin-left: auto; margin-right: auto;\">Grab our free workshop kit with templates and more!<\/h2>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">If you\u2019d like more information on the full Design Thinking process and how to run your own sessions, then download our <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/workshops?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=prototyping\">free Workshop Kit<\/a>.<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\"><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/workshops\"><br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-19405\" src=\"https:\/\/marvel7077.wpengine.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_2-1500x750.png\" alt=\"\" width=\"720\" height=\"360\" srcset=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_2-1500x750.png 1500w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_2-600x300.png 600w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_2-768x384.png 768w, https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/DesignThinking_Social_2.png 1728w\" sizes=\"auto, (max-width: 720px) 100vw, 720px\" \/><br \/>\n<\/a><\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">The kit includes a workbook, facilitator guide, workshop slides and a presentation template that will support you in applying the five Design Thinking stages in an interactive and fun session!<\/p>\n<p class=\"pageWrap pageWrap--s marginBottom-m paddingBottom-s c-slate lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">Get started today and <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/projects\/new\/prototype\/team?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=prototyping\">create your first prototype<\/a> and share your <a class=\"link link--blue fontWeight-4\"href=\"https:\/\/twitter.com\/marvelapp?utm_source=blog&amp;utm_medium=deeplink&amp;utm_campaign=PLG&amp;utm_term=%7Bdate%7D&amp;utm_content=prototyping\">updates with us on Twitter<\/a>.<\/p>\n<h3 class=\"pageWrap pageWrap--s marginTop-l marginBottom-m c-black lineHeight-xl fontSize-xl fontWeight-5\">Further reading:<\/h3>\n<ul class=\"pageWrap pageWrap--s list list--unordered marginBottom-l lineHeight-l fontSize-l fontWeight-3 breakPointM-fontSize-xl breakPointM-lineHeight-xl\">\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/how-to-run-a-remote-design-thinking-workshop\/\">How to run a remote design thinking workshop<\/a><\/li>\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/prototyping-101-ultimate-guide\/\">The Ultimate Guide to Prototyping<\/a><\/li>\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/run-empathy-user-journey-mapping-workshop\/\">How to Run an Empathy &amp; User Journey Mapping Workshop<\/a><\/li>\n<li><a class=\"link link--blue fontWeight-4\"href=\"https:\/\/marvelapp.com\/blog\/guerrilla-user-testing\/\">Guerrilla User Testing<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Did you know that hundreds of workshops take place around the world every month using Marvel? From schools to enterprises, Marvel has powered workshops of all shapes and sizes. Whether that&#8217;s meeting rooms with 5 people working on a feature, to halls with over 50 kids learning about Design Thinking. The great thing about our workshops is that anyone can&#8230; <a class=\"link link--blue fontWeight-4\" href=\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/\">Read More &#65515;<\/a><\/p>\n","protected":false},"author":282,"featured_media":19382,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[429],"tags":[],"class_list":["post-19367","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-product-tips-and-tricks"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v15.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<meta name=\"description\" content=\"Putting users and experiences first is the key to unlocking any potential. Here&#039;s how you can use prototypes to run your first design thinking workshop.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Design Thinking - How to Run Your Own Design Thinking Workshop\" \/>\n<meta property=\"og:description\" content=\"Putting users and experiences first is the key to unlocking any potential. Here&#039;s how you can use prototypes to run your first design thinking workshop.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/\" \/>\n<meta property=\"og:site_name\" content=\"Marvel Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/marvelapp\" \/>\n<meta property=\"article:published_time\" content=\"2020-02-26T01:45:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2020-10-09T09:17:04+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/workshop-designthinking.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"720\" \/>\n\t<meta property=\"og:image:height\" content=\"400\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@marvelapp\" \/>\n<meta name=\"twitter:site\" content=\"@marvelapp\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\">\n\t<meta name=\"twitter:data1\" content=\"7 minutes\">\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#organization\",\"name\":\"Marvel\",\"url\":\"https:\/\/marvelapp.com\/blog\/\",\"sameAs\":[\"https:\/\/www.facebook.com\/marvelapp\",\"https:\/\/www.instagram.com\/marvelapp\/\",\"https:\/\/www.linkedin.com\/company\/marvel-app\/\",\"https:\/\/twitter.com\/marvelapp\"],\"logo\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#logo\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/marvelapp.com\/wp-content\/uploads\/2018\/06\/Logo-Light.png\",\"width\":1605,\"height\":1130,\"caption\":\"Marvel\"},\"image\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#logo\"}},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#website\",\"url\":\"https:\/\/marvelapp.com\/blog\/\",\"name\":\"Marvel Blog\",\"description\":\"Ideas and words on user experience, design, collaboration and more\",\"publisher\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":\"https:\/\/marvelapp.com\/blog\/?s={search_term_string}\",\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#primaryimage\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/marvelapp.com\/wp-content\/uploads\/2020\/02\/workshop-designthinking.jpg\",\"width\":720,\"height\":400},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#webpage\",\"url\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/\",\"name\":\"Design Thinking - How to Run Your Own Design Thinking Workshop\",\"isPartOf\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#primaryimage\"},\"datePublished\":\"2020-02-26T01:45:22+00:00\",\"dateModified\":\"2020-10-09T09:17:04+00:00\",\"description\":\"Putting users and experiences first is the key to unlocking any potential. Here's how you can use prototypes to run your first design thinking workshop.\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/\"]}]},{\"@type\":\"Article\",\"@id\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#webpage\"},\"author\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#\/schema\/person\/bd72a934b7ff68bc81675996b1c9d959\"},\"headline\":\"How to Run Your First Design Thinking Workshop Using Marvel\",\"datePublished\":\"2020-02-26T01:45:22+00:00\",\"dateModified\":\"2020-10-09T09:17:04+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#webpage\"},\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/#organization\"},\"image\":{\"@id\":\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#primaryimage\"},\"articleSection\":\"Product Tips &amp; Tricks\",\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/marvelapp.com\/blog\/run-first-design-thinking-workshop-prototypes\/#respond\"]}]},{\"@type\":\"Person\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#\/schema\/person\/bd72a934b7ff68bc81675996b1c9d959\",\"name\":\"Charlotte Hall\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/marvelapp.com\/blog\/#personlogo\",\"inLanguage\":\"en-GB\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/1115801ad57ca66f17e8fd5f9fd46010228d348a4bb2aab51fa38c187df7a3a1?s=96&d=mm&r=g\",\"caption\":\"Charlotte Hall\"},\"description\":\"Product Marketer at Marvel. Part-time true crime connoisseur. @ch_hall\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","_links":{"self":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts\/19367","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/users\/282"}],"replies":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/comments?post=19367"}],"version-history":[{"count":0,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/posts\/19367\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/media\/19382"}],"wp:attachment":[{"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/media?parent=19367"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/categories?post=19367"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/marvelapp.com\/blog\/wp-json\/wp\/v2\/tags?post=19367"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}