{"id":2993,"date":"2021-02-02T00:22:44","date_gmt":"2021-02-02T00:22:44","guid":{"rendered":"https:\/\/swisstomato.ch\/2021\/02\/02\/app-and-web-prototyping\/"},"modified":"2021-02-02T00:22:44","modified_gmt":"2021-02-02T00:22:44","slug":"app-and-web-prototyping","status":"publish","type":"post","link":"https:\/\/swisstomato.ch\/en\/2021\/02\/02\/app-and-web-prototyping\/","title":{"rendered":"App and web prototyping"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">A prototyping tool allows designers, clients and project managers to collaborate better in a more effective way. Consulting on a wireframe or design was a really cumbersome and time consuming process before live prototyping tools. Series of meetings, emails or phone conversations were needed to reach the final design. Now we can collaborate on prototypes in a very easy way and have the biggest benefit: if we fail with any part of the mockup we can land softly \u2013 there is always a possibility to rework or improve the wireframe and design.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h2><b>InVision \u2013 the tool we use<\/b><\/h2>\n<p><span style=\"font-weight: 400;\"><a href=\"https:\/\/www.invisionapp.com\/\" target=\"_blank\" rel=\"noopener\">Invision<\/a> is by far the most popular prototyping tool in the world. We think it is the most effective prototyping tool in the market so we have been using it for a long time. The best functions are the following:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><i><span style=\"font-weight: 400;\">Easy to use: <\/span><\/i><span style=\"font-weight: 400;\"><br \/>\n<\/span><span style=\"font-weight: 400;\">Since all tools are different from each other and provide various features, it would consume a lot of time to learn the tool. But fortunately InVision has a great user interface and it&#8217;s important because clients can understand quickly how it works.\u00a0<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><i><span style=\"font-weight: 400;\">Sharing:<\/span><\/i><span style=\"font-weight: 400;\"><br \/>\n<\/span><span style=\"font-weight: 400;\">Client, Designer and Project manager collaboration is key for design. InVision provides collaboration ability for multiple people to be in sync with each other.<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><i><span style=\"font-weight: 400;\">Quality:<\/span><\/i><span style=\"font-weight: 400;\"><br \/>\n<\/span><span style=\"font-weight: 400;\">There can be different requirements for projects which could be classified into low, medium and high fidelity. Whether the project is just a wireframe or a full website or app design, InVision is an application where all needs are met.<\/span><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h3><b>A simple guide on how it works<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">We don\u2019t have to give our clients a wordy guide how this prototyping tool works. We just provide a simple link or a button in our presentations to try the demo. It\u2019s easy to understand for the first use. Here is the client journey:<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-17661\" src=\"https:\/\/swisstomato.ch\/wp-content\/uploads\/2021\/02\/Img-01.jpg\" alt=\"prototyping\" width=\"1200\" height=\"673\" \/><\/p>\n<p><span style=\"font-weight: 400;\">Client gets a simple link or button leading to the demo. The link also can be locked and only openable for allowed persons.\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><i><span style=\"font-weight: 400;\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-17664\" src=\"https:\/\/swisstomato.ch\/wp-content\/uploads\/2021\/02\/Img-02.jpg\" alt=\"\" width=\"1200\" height=\"744\" \/><\/span><\/i><\/p>\n<p><span style=\"font-weight: 400;\">When the demo has been loaded the client can try the design as if it were real. We can insert animations as well and navigation interactions too. The prototypes can be mirrored to mobile devices. Whether your project is an app, you can try the demo on your phone, or if it\u2019s a website you can try the responsive versions (tablet, mobile) on mobile devices.<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">After checking the demo, comments can be added to each element from the client side (more users can leave comments of course).<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Once comments have been added, the designer and the project manager gets notifications. So collaboration can start quickly. If necessary there is a possibility to solve the comments from the designer side while the client is commenting the demo. It makes the collaboration process very quick.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><b>Additional features<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">After finishing the demo commenting process, the design phase of the project can be closed with a detailed website \/ app design guideline \u2013 also in InVision.<\/span><\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-17667\" src=\"https:\/\/swisstomato.ch\/wp-content\/uploads\/2021\/02\/Img-03.jpg\" alt=\"\" width=\"1200\" height=\"613\" \/><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">All design elements \u2013 fonts, colours, dimensions, screens \u2013 are collected in a simple interactive page to use them in the future. It makes the additional work easy and effective.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">In conclusion, a prototyping tool has its own special advantages, specialties and suit different needs. The collaboration on wireframe and design is a way more easier than before so time can be spent to make the design more perfect and accurate. It results in a way better final product with less spent time and energy effort and also makes the client more satisfied.<\/span><\/p>\n<p>&nbsp;<\/p>\n<p>Please contact Swiss Tomato&#8217;s graphic experts if you need any further info. We will be glad to discuss with you your plans and make them alive with our artistic concepts. Let&#8217;s have a tomato juice <a href=\"https:\/\/swisstomato.ch\/en\/#contact-us\">together<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A prototyping tool allows designers, clients and project managers to collaborate better in a more effective way. Consulting on a wireframe or design was a really cumbersome and time consuming process before live prototyping tools. Series of meetings, emails or phone conversations were needed to reach the final design. Now we can collaborate on prototypes [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1664,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[4],"tags":[],"acf":{"first_post_thumbnail":2997,"post_thumbnail":3003,"home_slider_image":3009,"custom_class":""},"featured_image_big_url":"https:\/\/swisstomato.ch\/wp-content\/uploads\/2022\/06\/App-web-prototyping-3.jpg","featured_image_url":"https:\/\/swisstomato.ch\/wp-content\/uploads\/2022\/06\/App-web-prototyping-3.jpg","date_formatted":" 02, 2021","month_number":"2","_links":{"self":[{"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/posts\/2993"}],"collection":[{"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/comments?post=2993"}],"version-history":[{"count":0,"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/posts\/2993\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/media\/1664"}],"wp:attachment":[{"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/media?parent=2993"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/categories?post=2993"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/swisstomato.ch\/en\/wp-json\/wp\/v2\/tags?post=2993"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}