<?xml version="1.0" encoding="UTF-8"?><rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:atom="http://www.w3.org/2005/Atom" version="2.0" xmlns:cc="http://cyber.law.harvard.edu/rss/creativeCommonsRssModule.html">
    <channel>
        <title><![CDATA[Handpicked stories about Digital design on Medium]]></title>
        <description><![CDATA[Digital design on Medium: More than just a pretty typeface.]]></description>
        <link>https://medium.com/topic/digital-design?source=rss-------8-----------------digital_design</link>
        <image>
            <url>https://cdn-images-1.medium.com/proxy/1*TGH72Nnw24QL3iV9IOm4VA.png</url>
            <title>Handpicked stories about Digital design on Medium</title>
            <link>https://medium.com/topic/digital-design?source=rss-------8-----------------digital_design</link>
        </image>
        <generator>Medium</generator>
        <lastBuildDate>Thu, 01 Mar 2018 07:21:08 GMT</lastBuildDate>
        <atom:link href="https://medium.com/feed/topic/digital-design" rel="self" type="application/rss+xml"/>
        <webMaster><![CDATA[yourfriends@medium.com]]></webMaster>
        <atom:link href="http://medium.superfeedr.com" rel="hub"/>
        <item>
            <title><![CDATA[10 Black Designers To Follow This Black History Month]]></title>
            <link>https://medium.com/@trydesignlab/10-black-designers-to-follow-this-black-history-month-7882bae9dd6e?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/7882bae9dd6e</guid>
            <category><![CDATA[design]]></category>
            <category><![CDATA[black-history-month]]></category>
            <category><![CDATA[black-history]]></category>
            <category><![CDATA[ux-design]]></category>
            <category><![CDATA[design-thinking]]></category>
            <dc:creator><![CDATA[Designlab]]></dc:creator>
            <pubDate>Wed, 28 Feb 2018 16:19:45 GMT</pubDate>
            <atom:updated>2018-02-28T16:19:45.290Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*m7WLYiUhkGbPnRmf.jpg" /><figcaption><em>Photo: “You may come in” by Clem Onojeghuo (#8 in this list)</em></figcaption></figure><p>At the beginning of his SXSW presentation, <a href="https://www.youtube.com/watch?v=eBuFCkmyYuA">“Where Are The Black Designers”</a>, Maurice Cherry, digital creator and podcaster, poignantly asks, “How many black designers do you know?”</p><p>Cherry highlights the disparity of black designers’ representation in design culture and community, including how black designers are generally not seen or heard in podcasts, speaker panels, or blogs.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/640/0*tHSM-xY7LvoZjPSP.png" /><figcaption><em>Image: Maurice Cherry</em></figcaption></figure><p>Through his comedy, <a href="https://www.essence.com/video/chris-rock-black-history-month">Chris Rock</a> suggests not only that February is far too short a month to honor the accomplishments of black Americans, but also that the short celebration of Black History Month runs the risk of glossing over black people’s innumerable and diverse contributions throughout history:</p><blockquote>Black history month is in February, the shortest month of the year, and the coldest, just in case we want to have a parade. I’m black so it’s always black history month. It just always is. It’s not like, hey I know we’ve been ignoring black people for the last eleven months, but this month’s we’re gonna black it up!</blockquote><p>Given this disparity in (and beyond) the design industry, this Black History Month, we wanted to give a shoutout (in alphabetical order) to 10 awesome designers whose work we love. We hope you’ll feel as inspired as we do by their stories — not only this month, but for the rest of the year, too!</p><h4>1. Gail Anderson: educator, designer, author, creative director, and typography extraordinaire</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/640/0*MmNLJhGaD1BeQtWm.jpg" /></figure><p>You’ll be hard pressed to find a design portfolio as diverse and a creative output as illustrious as that of Gail Anderson, <a href="http://gailycurl.com/About-Contact">whose career and influence</a> on the design community is immeasurable. Who else can say that they’ve designed U.S. Postal Service stamps, handled art direction for Rolling Stone magazine, <strong>and</strong> co-authored the text, <em>Outside the Box</em>, about hand-drawn packaging from around the world? Anderson’s design of the postage stamp commemorating the 150th anniversary of the Emancipation Proclamation sold over 50,000,000 copies!</p><h4>2. Jessica Bellamy: entrepreneur, visual storyteller, and motion infographic designer</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*2oYX3fJkgq32fTt3.jpg" /></figure><p>As a Design Justice advocate, <a href="https://www.jessicabellamy.design/">Jessica Bellamy</a> combines data with visual storytelling and personal narratives in order to help nonprofits and communities enact social change. During this <a href="https://revisionpath.com/jessica-bellamy/">Revision Path podcast</a> interview, Bellamy shares about her trajectory — how a college experience of creating an infographic in lieu of an academic paper sparked her calling to design information graphics as a way to break down complicated social justice issues. And don’t miss Bellamy’s kickass Instagram posts, like this one about <a href="https://www.instagram.com/p/BfZWV-zHFk4/?hl=en&amp;taken-by=jessicabellamy.design">which African cultures</a> inspired the costumes in the film, Black Panther, as well as her innovative Youtube series, <a href="https://www.youtube.com/watch?v=npp_CQ_6wL8">“Designing From The Margins”</a>.</p><h4>3. Maurice Cherry: Atlanta-based digital creator, educator, and founder of the award-winning podcast, Revision Path</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/400/0*d5QdhkKIffT_swWD.jpg" /></figure><p>No doubt, the design industry (and much of this article, in fact!) owes a great deal to <a href="http://mauricecherry.com/">Maurice Cherry’s</a> efforts championing black designers. He’s the pioneering creator of the Black Weblog Awards, the web’s longest-running event celebrating black bloggers, video bloggers, and podcasters. He’s also the creator of the award-winning podcast <a href="https://revisionpath.com/">Revision Path</a>, which showcases “some of the best Black graphic designers, web designers, and web developers from all over the world.”</p><p>Other projects include <a href="http://28daysoftheweb.com/">28 Days of the Web</a> and <a href="http://theyearoftea.com/">The Year of Tea</a>, a short daily podcast in which Cherry sampled and reviewed a new tea each day of 2015. Most recently, he was selected as one of this year’s <a href="http://gdusa.com/peopletowatch2018/maurice-cherry">“People to Watch”</a> by the <em>Graphic Design USA </em>magazine, a publication for creative professionals since 1963.</p><h4>4. Qa’id Jacobs: New York-grown product and system designer living in Amsterdam (and an esteemed <a href="https://trydesignlab.com/Qaid/">mentor at Designlab!</a>)</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/300/0*Hq38dA9MccEXmodJ.png" /></figure><p>Check out <a href="http://qaidjacobs.com/">Qa’id Jacob’s</a> candid AlterConf talk, <a href="https://www.youtube.com/watch?v=JHB7t8WWBdE">“Honor Your Struggle by Hacking Corporate Culture”</a>, which discusses his experiences of often being the “only black guy” on a team and how we can fix broken, less inclusive systems — including workplace systems — to affect positive change in our workplace cultures. And don’t miss his <a href="https://revisionpath.com/qaid-jacobs-part-1/">two-part interview</a> with Maurice Cherry on Revision Path!</p><p>When asked about how he sees his role as a mentor in the design community, Qa’id says,</p><blockquote>I’m taking a cue from my own years-long search for a mentor, which was fruitless for a long time until I realized that I had too strict a definition of mentor. So I understand that there are designers who are more talented or experienced than me in some areas; at the same time it is true that no other designer has traveled the path I’ve been on or worked on the same projects under the same life/work circumstances. Through stories from my own work or life experiences, I try to connect to the the design challenges or personal challenges of the people I am mentoring.</blockquote><h4>5. Eunice W. Johnson: Director of Ebony, pioneer for fashion and black designers</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/303/0*AYx9n-Tlh2u15dNV.jpg" /></figure><p>Eunice W. Johnson was the creator of the <a href="https://www.npr.org/2014/02/15/276987206/the-ebony-fashion-fair-changing-history-on-the-catwalk">Ebony Fashion Fair</a>, a tour showcasing haute couture and ready-to-wear fashion for a mostly African-American audience for more than 50 years. Her entrepreneurial legacy has nurtured the careers of notable black models, hair stylists, makeup artist, and designers — such as <a href="http://www.tracyreese.com/">Tracy Reese</a> — and has raised more than $55 million for civil rights groups, hospitals, community centers and scholarships. Read more about the Museum at the Fashion Institute of Technology’s <a href="https://www.thecut.com/2016/12/black-designers-finally-get-a-museum-exhibit.html">“Black Fashion Designers”</a> exhibition that featured pieces by Johnson and over 60 designers.</p><h4>6. Hendrika Makilya: California-based multidisciplinary creative with an emphasis on design as storytelling, product design, and art direction (and an esteemed <a href="http://trydesignlab.com/hmakilya/">mentor at Designlab!</a>)</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/300/0*qFvVuv1XhynJS1_T.png" /></figure><p>A savvy designer from Atlanta who now works in the Bay Area, <a href="https://www.hendrika.info/">Hendrika Makilya</a> has designed solutions for clients including Apple, IBM, and Salesforce. When we asked her what she thinks the design industry could do to foster a more inclusive environment, Hendrika said that she feels that “organizations like Designlab are making an impact in that regard”. She also recommends that designers approach companies with explicit commitments to diversity and — to better understand and learn from what they’re doing right — ask them, “what are you doing to change the numbers in design?”</p><p>Hendrika also shared more about why she loves mentoring and helping aspiring designers — especially folks from less privileged backgrounds because, as she says, “I can connect to the urgency and challenges [for that person], and for me, that’s kind of special to be able, through Designlab, to help this person I may not have known otherwise.”</p><h4>7. Cheryl D. Miller: designer and activist</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/500/0*Aqjc7B6Wq-lRHL1U.jpg" /></figure><p>Published over 30 years ago, Miller’s article, <a href="https://www.scribd.com/document/287765658/Black-Designers-Missing-in-Action-by-Cheryl-D-Miller">“Black Designers: Missing in Action”</a>, still offers relevant insights about the systemic barriers that negatively impact diversity and inclusivity in the design community. According to Miller, prohibitive factors impacting black designers in the industry included a lack of family support, the cost of art school, not enough financial aid, lack of mentorship, and so on. Her courage sparked an important conversation about diversity and inclusivity in the design industry that resonates today.</p><h4>8. Clem Onojeghuo: 2017 editorial photographer of the year on Unsplash</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/933/0*jgxpqBdTHHwroI4M.jpg" /></figure><p><a href="https://unsplash.com/@clemono2">Clem Onojeghuo</a> is a digital graphic designer and photographer, as well as a prolific contributor to the public-domain photo community Unsplash. The quality of his Saul Leiter-inspired street photography earned him Unsplash’s #1 badge for editorial photography last year.</p><p>Based in Letchworth, UK (40 miles north of London), Onojeghuo shares his talents by hosting photo walks around London districts like Shoreditch, Southbank and Soho. You can read more about his story and inspiration in <a href="https://medium.com/unsplash/host-profile-clem-onojeghuo-7401bc56e9b9">this profile piece</a> over on Medium.</p><h3>9. Maya Penn: entrepreneur, philanthropist, author, and animator</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/434/0*FJykhLsVMAFAziQQ.jpg" /></figure><p>At the age of eight, Maya Penn founded <a href="http://mayasideas.com/">Maya’s Ideas</a>, a fashion company that focuses on handcrafted sustainable clothing and donates 10–20% of its profits to charities and environmental organizations. <a href="https://www.ted.com/talks/maya_penn_meet_a_young_entrepreneur_cartoonist_designer_activist#t-62025">Her 2013 talk</a> is ranked as one of top 15 TEDWomen talks of all time, and she has received the Black Enterprise Teenpreneur of the Year Award, a commendation from President Barack Obama, and the US EPA for outstanding achievement in environmental stewardship. Her creative output and altruistic focus are awe-inspiring!</p><h3>10. Rafael Smith: design lead at IDEO.org</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*LNTB1_hL5kGQroHk.jpg" /></figure><p>As the design lead at <a href="https://ideo.org/">IDEO.org</a>, Smith uses his skills in product design and industrial design to improve the lives of people in poor and vulnerable communities worldwide. He also founded and created <a href="https://www.youtube.com/watch?v=M4tg_wudimw">Uber Shelter</a>, a company that designed emergency shelters for disaster relief in Haiti, Venezuela, and Japan. <a href="https://www.youtube.com/watch?v=PS2_kAL8kS0">Check out his talk</a> for about the Design + Diversity Conference about how we can apply design and technology to mitigate unconscious bias.</p><h4>See also: <a href="http://28daysoftheweb.com/about/">28 Days of the Web</a></h4><p>In conjunction with and celebration of Black History Month, <a href="http://28daysoftheweb.com/">28 Days of the Web</a> features a different web designer, graphic designer, or web developer every day for the month of February!</p><p>Through these profiles and resources, we hope that your response to the question, “How many black designers do you know?” will steadily increase in the year ahead.</p><p>With that in mind, here are some ways that we might better embrace the talents and insights of black designers today, and foster the black designers of tomorrow:</p><p>And last but not least, let’s consider this poignant point by Maurice Cherry from his article, <a href="https://mailchimp.com/resources/resources-for-partners/maurice-cherry-blackweblogawards/">“Models of Possibility”</a>, in which he responds about the visibility gap of black designers and their contributions:</p><blockquote>You can’t be what you can’t see. How different would my life path have been if I knew, at 18, that this was an option? With projects like Revision Path and 28 Days of the Web, it’s important for me to give the next generation that platform, so young people know this is something they can do.</blockquote><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2F30422c%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2F30422c%2F&amp;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252F30422c%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/3ff3ed195075d9778ff4576ebb483be5/href">https://medium.com/media/3ff3ed195075d9778ff4576ebb483be5/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=7882bae9dd6e" width="1" height="1">]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Prototyping, Libraries on Sketch Cloud and an official iOS UI kit in Sketch 49]]></title>
            <link>https://blog.sketchapp.com/prototyping-libraries-on-sketch-cloud-and-an-official-ios-ui-kit-in-sketch-49-bf090c70796c?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/bf090c70796c</guid>
            <category><![CDATA[design-tools]]></category>
            <category><![CDATA[sketch]]></category>
            <category><![CDATA[prototyping]]></category>
            <category><![CDATA[design]]></category>
            <category><![CDATA[ui]]></category>
            <dc:creator><![CDATA[Sketch]]></dc:creator>
            <pubDate>Wed, 28 Feb 2018 11:23:30 GMT</pubDate>
            <atom:updated>2018-02-28T16:11:23.923Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*n-YrOt8WBq-zxpmkiR7SBQ.png" /></figure><p>Sketch 49 has arrived and, hot on the heels of our Libraries update, we’re adding yet another huge and highly anticipated feature to Sketch. We understand design, so we know that you can’t always tell if something works based on static screens alone. Sometimes you need to see the entire flow in action and the best way to do this is to turn your designs into interactive prototypes. With our latest update, we’re making that whole process seamless — say hello to Prototyping in Sketch.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2F5bsptX8MdPg%3Ffeature%3Doembed&amp;url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D5bsptX8MdPg&amp;image=https%3A%2F%2Fi.ytimg.com%2Fvi%2F5bsptX8MdPg%2Fhqdefault.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=youtube" width="854" height="480" frameborder="0" scrolling="no"><a href="https://medium.com/media/e993dc234bc01ba9f44d29fe79b79f01/href">https://medium.com/media/e993dc234bc01ba9f44d29fe79b79f01/href</a></iframe><p>That’s not all though. Alongside Prototyping we’re adding new ways to share Libraries via Sketch Cloud and the official iOS 11 Apple UI Design Resource is now built right into Sketch as a Shared Library. Here’s an overview of the headline features in Sketch 49:</p><ul><li>Prototyping in Sketch</li><li>Apple’s official UI design resource for iOS</li><li>Shared Libraries on Sketch Cloud</li><li>Over 60 other enhancements and bug fixes, including massively improved performance of Sketch in general, particularly when working on complex documents with lots of Symbols</li></ul><h3>Prototyping in Sketch</h3><p>In Sketch 49, we’re introducing Prototyping, letting you transform your designs into interactive prototypes and preview them, without ever leaving the app.</p><p>This new set of tools allows you to connect your Artboards, apply transitions, and then preview your designs right inside Sketch, on your mobile devices with Mirror, or on Sketch Cloud, where you can share your prototypes with colleagues, clients and the world.</p><p>To turn your static designs into clickable prototypes, simply select a layer and add a Link to an Artboard. Once you have two Artboards connected, you can add a simple animation for a smooth transition from one state to the next. Rinse and repeat across your whole project and you can quickly and easily build a lightweight, working prototype of your app or website — perfect if you’re working on a project and need to share a quick demo or you want to check the usability of a specific workflow.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1000/1*7ODJEBhANluqsuIrjgUfSQ.gif" /></figure><p>To view your Prototype in action just click the Preview button in the toolbar and your prototype will launch in a dedicated window, allowing you to interact with your app or web design as if it were the real thing.</p><p>Prototyping makes presenting your work and getting sign-off on projects a whole lot easier. If you want to share a working prototype with a developer, colleague or client, just upload to Sketch Cloud, send them the link and they can interact with and comment on your designs, right in the browser. You can even create Start Points that let you launch your preview at a specific Artboard, so they know exactly where to begin.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1000/1*2SR2_3uc30VaRxB_qsaWdg.gif" /></figure><p>If you’re working on designs for iPhone or iPad, we’ve now added Prototyping support to Sketch Mirror for iOS, so you can preview your prototypes on the screens they were designed for. Don’t forget to download the new Sketch Mirror update to try out your Prototypes there.</p><p>With Prototyping built right into Sketch, it’s now easier than ever to take your designs from ideation through to realization and to share your concepts with the people that matter.</p><p>You can find out more about how to make the most of Prototyping in our <a href="http://sketchapp.com/docs/prototyping/">documentation</a>.</p><h3>Shared Libraries in Sketch</h3><p><a href="https://blog.sketchapp.com/introducing-libraries-and-smooth-corners-in-sketch-47-2abc5dfc1fb3">In Sketch 47 we introduced Libraries</a> and they’ve empowered you and your teams to work better, together. In Sketch 49 we’re building on this foundation and bringing you a new way to share and access Libraries.</p><p>With Shared Libraries, you can now download, and subscribe to, Libraries that have been uploaded to <a href="http://sketch.cloud">Sketch Cloud</a> and, because all of this is built on open web technologies, these Libraries can be stored and accessed from anywhere on the web. We’re excited to say that we’ve taken advantage of this feature and teamed up with Apple to build their official iOS 11 UI kit right into Sketch, as a Shared Library.</p><h4>Shared Libraries on Sketch Cloud</h4><p>With Sketch Cloud, you can already upload a Document and share your designs with colleagues or clients, all from inside the app. With the latest update, you can now subscribe to Documents uploaded to Sketch Cloud and they’ll be added directly to Sketch, as Shared Libraries.</p><p>When you subscribe to a Shared Library, your Library file will remain linked to the original Sketch Cloud Document so, if the creator uploads a new version, you’ll get a notification and you can choose to update your local Library as well. This is really useful if you’re working with a team and need a single source of truth for your design system or style guide. Working on a free UI Kit or another cool project you want to shout about? Sketch Cloud is now the easiest place to share your Library with the community.</p><p>If you want to allow your Documents to be added as Shared Libraries, simply select the <strong>Allow others to download this Document </strong>option when you upload your file to Sketch Cloud.</p><p>If you want to add a Document from Sketch Cloud as a Shared Library, just click <strong>Download </strong>›<strong> Add Library to Sketch</strong> and the Document will be added to the Libraries tab in Preferences, and you’ll be notified if the original Document is updated.</p><h4>Apple iOS UI Library Built-in</h4><p>Apple’s design templates have always been the gold standard when it comes to iOS design resources and the obvious go-to when designing for iPhone or iPad.</p><p>We’re really excited to say that we’ve integrated Apple’s iOS 11 design template into Sketch, and can now offer this invaluable resource as a built-in Library.</p><p>The Apple iOS UI library has all of the components you’ll need to start working on your next project, carefully crafted for Sketch. This expansive Library includes everything, from tab bars and status bars to buttons and switches, ready to be inserted into your latest designs.</p><p>You can download the Apple iOS UI Library from the Libraries tab in Preferences and, when Apple updates their Document, you’ll be notified and can update your designs to the latest version.</p><h3>More than 60 other improvements and bug fixes</h3><p>As always we’ve been listening to your feedback and made some other, smaller improvements and bug fixes since Sketch 48. Here are some of the highlights:</p><ul><li>We’ve massively improved performance of the app as a whole, especially when working in complex documents with many, nested Symbols</li><li>When vector editing, you can now bend a path segment by holding the Command key and dragging to create or adjust curves</li><li>When using the Pen tool, a preview of new points will be displayed on hover</li><li>You can find a full list of bug fixes and improvements on our <a href="https://www.sketchapp.com/updates/">updates</a> page</li></ul><p>Sketch 49 is a free update for everyone with an active license. If you need to renew your license, you’ll get Sketch 49 and a whole year’s worth of updates after that.</p><p>We always love to see what you’re creating with Sketch so if you’ve made an awesome Library and uploaded it to Sketch Cloud, let us know — we might even feature it online or in our newsletter. If you’ve got questions or feedback, you can get in touch with us via our <a href="https://www.sketchapp.com/support/contact/">support page</a> or join in the conversation on <a href="https://twitter.com/sketchapp">Twitter</a>, or on our <a href="https://www.facebook.com/groups/sketchformac/">Facebook group</a>.</p><p>We’re already working on Sketch 50 and we’ll tell you all about it soon.</p><figure><a href="https://sketchapp.com/docs/prototyping"><img alt="" src="https://cdn-images-1.medium.com/max/618/1*Y7nSGjN5XemPtsHMWX6t-Q.png" /></a></figure><figure><a href="https://sketch.cloud/"><img alt="" src="https://cdn-images-1.medium.com/max/408/1*_q2kHtaNr5FqDYH2Djdt1A.png" /></a></figure><figure><a href="https://sketchapp.com/get"><img alt="" src="https://cdn-images-1.medium.com/max/408/1*Tg7XSx5vjZjHxiNtchi-aw.png" /></a></figure><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=bf090c70796c" width="1" height="1"><hr><p><a href="https://blog.sketchapp.com/prototyping-libraries-on-sketch-cloud-and-an-official-ios-ui-kit-in-sketch-49-bf090c70796c">Prototyping, Libraries on Sketch Cloud and an official iOS UI kit in Sketch 49</a> was originally published in <a href="https://blog.sketchapp.com">Sketch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[What web designers need to know about Hick’s Law]]></title>
            <link>https://uxplanet.org/what-web-designers-need-to-know-about-hicks-law-4601b7dc0470?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/4601b7dc0470</guid>
            <category><![CDATA[ux-design]]></category>
            <category><![CDATA[ui]]></category>
            <category><![CDATA[ux]]></category>
            <category><![CDATA[user-experience]]></category>
            <dc:creator><![CDATA[Justinmind]]></dc:creator>
            <pubDate>Wed, 28 Feb 2018 07:00:46 GMT</pubDate>
            <atom:updated>2018-02-28T09:12:12.953Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*Gaiat1xkFFGkWVtQ.png" /></figure><h4><strong>Hick’s Law guides UX designers to create effortless user experiences. Here’s how to apply the law to your UX design</strong></h4><p>UX and UI designers have a big stake in the emotional state of their users. Who wants to create user interfaces, mobile apps and websites which just frustrate and overwhelm people? Nobody, that’s who.</p><p>Thankfully, designers have many sets of principles to choose from to help them create awesome user experiences. Whether it’s <a href="https://www.justinmind.com/blog/how-to-improve-ux-using-gestalt-principles/">gestalt theory</a>, <a href="https://www.interaction-design.org/literature/article/occam-s-razor-the-simplest-solution-is-always-the-best">Occam’s Razor</a> or prototyping in <a href="https://www.justinmind.com/usernote/signUp.action?blog-link-post">Justinmind</a>, designer’s don’t need to go at it alone.</p><p>Another useful principle to guide designers on their treacherous journey to user experience paradise is Hick’s Law.</p><p>In this post, we’ll cover what you need to know about Hick and his law, and how you can apply it when prototyping and designing great user experiences.</p><p><a href="https://www.justinmind.com/usernote/signUp.action?blog-banner-post"><strong><em>Use Hick’s Law to create awesome user experiences. Prototype them in Justinmind. Download now.</em></strong></a></p><h4><strong>What is Hick’s Law</strong></h4><p>Have you ever walked into a supermarket to buy bread? If you go to Walmart.com and type in ‘bread’ you will be shown 2,072 results.</p><p>That’s a serious amount of bread. Croissants, bagels, brown bread, white bread, baguettes, multi-grain buns… the list is almost endless. And for what? Just for a bit of flour, water and yeast.</p><p>But this is a good thing, right? We have choice. No matter what sort of bread you desire, you’re likely to find it among the 2,072 varieties on offer. And that’s just Walmart. That doesn’t take into account bakeries, delis or other supermarkets.</p><p>So, what does bread have to do with Hick’s Law? Well, Hick’s Law states that the more choices a person is given, the longer a person will take to reach a decision. Suddenly all that bread seems daunting.</p><p>If you want bread today, you might spend 20 minutes or more looking at all the different types. Whereas 30 to 40 years ago, before the unchecked proliferation of consumerism, your choice was most likely limited to plain white bread and, if you were lucky, a whole grain loaf. Your choice would take barely a moment.</p><p>Barry Schwartz, in his seminal book <a href="https://www.amazon.com/Paradox-Choice-Why-More-Less/dp/149151423X">The Paradox of Choice</a>, writes:</p><blockquote>“Instead of being fetishistic about freedom of choice, we should ask ourselves whether it nourishes us or deprives us, whether it makes us mobile or hems us in, whether it enhances self-respect or diminishes it”</blockquote><p>Essentially, Hick’s Law says that the time required to reach a decision increases <a href="https://www.wikiwand.com/en/Logarithm">logarithmically</a> with the number of choices.</p><p>The more choices you have, the longer you take to make a choice and the more likely you’ll experience information overload. Schwartz postulates that all this choice actually imprisons us.</p><figure><img alt="hicks-law-what-is-hicks-law-fitts-and-hicks-law" src="https://cdn-images-1.medium.com/max/810/0*i_1WZf61twBTm377.png" /></figure><h4><strong>Why Hick’s Law is important in UX design</strong></h4><p>Now what does Hick’s Law have to do with UX design? Can we use Hick’s Law to improve the user experience?</p><p>Let’s say you’re designing a new website for a local library.</p><p>Imagine that this library has specialist books and information and therefore a lot of different, but useful, categories for visitors to browse. Call it 50 categories.</p><p>When it comes to designing the navigation menu for the website, will you realistically want to show visitors 50 categories? No, that would be madness. 50 different options would disengage a visitor immediately and they would probably leave your website.</p><p>Hick’s Law helps designers to design in such a way that more users will visit and stay on your website.</p><h4><strong>The Hick’s Law formula</strong></h4><p>In 1952, two psychologists, William Hick (hence the name) and Ray Hyman, sought to understand the relationship between the number of stimuli and an individual’s reaction to to any given stimulus. And there’s a formula for that relationship:</p><p>RT = a + b log2 (n)</p><p>Don’t fret. This formula is simple when you get your head around it. RT is just the reaction time, “a” is the total time that is not involved with decision making, “b” is an empirically derived constant based on the cognitive process time for each option, <a href="https://books.google.es/books?id=l0QPECGQySYC&amp;pg=PA120&amp;dq=hick%27s+law&amp;hl=en&amp;sa=X&amp;ved=0ahUKEwjusoTh6sXZAhUR21MKHeNMC10Q6AEIKTAA#v=onepage&amp;q=hick&#39;s%20law&amp;f=false">which for humans is 0.155</a> and (n) is the number of alternative stimuli.</p><p>To illustrate with an example: say you’re on a website and you need to navigate somewhere. There’s a list of options and it takes you 2 seconds to read, understand and decide on which one navigation option to pick, out of 5 possible options. The response time, according to Hick’s Law goes as:</p><p>RT = (2 seconds) + (0.155 seconds)(log2(5)) = 2.36 seconds.</p><p>All it boils down to is that the time it takes to make a decision increases as the number of alternatives increases.</p><p>If there were more navigation options in our example, the response time would be higher. And a higher response time could lead to a visitor abandoning their user experience.</p><h4><strong>When to use Hick’s Law in UX design</strong></h4><p>Designers can use Hick’s Law to improve the efficiency of a design, but only to a degree.</p><p>Hick’s Law is especially good when it comes to decisions which are simple (i.e pick A or B or C) but its utility diminishes as the complexity of decisions increases.</p><p>A complex decision may be something like hierarchies of mutually exclusive options in a menu selection. Hick’s Law isn’t useful here as this menu would require reading, scanning and problem solving from the user.</p><p><a href="https://uxplanet.org/design-principles-hicks-law-quick-decision-making-3dcc1b1a0632">Anton Nikolov</a> put it really well in UX Planet: <em>less is faster</em>.</p><p>Designers can apply Hick’s Law when designing:</p><ul><li>Control display</li><li>Drop down menus</li><li>Contact pages</li><li>Sign up forms</li><li>Button selection</li><li>Navigation menus</li></ul><p>In UI design, Hick’s Law can be applied to help us organize and present navigation, content, images and functions for a user.</p><p>By using Hick’s Law, we should hopefully create designs which reduce frustration from the user because the information they want has been presented in the most efficient way possible.</p><h4><strong>4 ways to apply Hick’s Law in UI design</strong></h4><p>If you have a lot of options in your UI designs — say a 30 links in a navigation menu or 12 images in a carousel. Hick’s Law would tell us to reduce those options — but how? There are a few ways to apply Hick’s Law to limit the number of choices:</p><h4><strong>Categorizing choices</strong></h4><p>Even though Walmart gives 2,072 results for bread, they still use Hick’s Law for their navigation menus.</p><figure><img alt="hicks-law-ux-design-what-is-hicks-law" src="https://cdn-images-1.medium.com/max/810/0*p8IcU6Sbd0zvMAT9.png" /></figure><p>As you can see, under Food, Household and Pets, the food section is broken down into categories. We’re not given every food item that Walmart sells but instead useful, intuitive categories to find what we want.</p><p>When you click on pasta, you can browse all the pasta which is on offer and by the side the options are categorized again, this time by their type (i.e fresh pasta, filled pasta).</p><p>By categorizing choice, the user is not overwhelmed. As UX designers, we should group menu items into high-level categories — the user can go on further into the menus more confidently when they’re categorized in a sensible, straight-forward way.</p><h4><strong>Limiting the number of choices</strong></h4><p>When the choice is just too much, one way to prevent your user from having a mild panic attack is to simply limit the number of choices in your UI design.</p><p>Users <a href="https://janpersiel.com/form-fear-why-filling-out-forms-sucks/">hate filling out forms</a>. They take time and effort. A user might abandon a form altogether if there’s one input field too many.</p><p>Johan Ronsse’s 9th <a href="https://mono.company/journal/design-practice/the-10-commandments-of-good-form-design-on-the-web/">Commandment of Good Form Design on the Web</a> says <em>thou shalt minimizer user input.</em></p><p>Since people hate filling out forms, many mobile apps and websites let you sign up with just a click using your social media networks.</p><p>Limiting the number of choices is seen frequently in ecommerce. Take filling out credit card information — the sigh you make when your wallet is on the other side of the room can be heard all around the world. The solution? Limit that option and use a ‘quick buy’ option. Problem solved.</p><p>Heck, with Apple Pay all you need to do to make a purchase is flash your phone. No swiping or pin input necessary.</p><h4><strong>Divide and conquer</strong></h4><p>You might not have a ‘quick buy’ option on your ecommerce site and the user might still need to sign up and put in their payment information. This could be a complex and long process.</p><p>A way to prevent the seeming complexity of a payment process would be to break it down into steps. Email and password sign up on one screen, shopping cart details on another screen, delivery information on another screen and so on. Progressive disclosure, if you will.</p><p>By breaking down the process into smaller chunks with their own separate screen, you’ll be creating a more user friendly experience and the user will be more inclined to reach the end of the payment process than if they had to fill out all the information on one screen.</p><h4><strong>Hide and seek</strong></h4><p><a href="https://www.smashingmagazine.com/2009/10/minimizing-complexity-in-user-interfaces/">Tyler Tate’s</a> philosophy is “if you can’t kill a complex feature, the next best thing is to hide it”.</p><p>If there are complex options in your mobile app or website which could overwhelm your users then simply hide them for power users and <a href="http://justuxdesign.com/blog/designing-for-the-edge-cases">edge cases</a>.</p><p>Now, there is an argument about whether or not hiding rarely used options is good or bad practice but there are techniques in UX design you can use which both hide options and let power users know that they can find information.</p><p>Take computer settings, for example. Many options are available to used in a general panel and these options will usually satisfy the vast majority of people. But for more technical options, you’ll usually come across an “advanced settings” button. This</p><h4><strong>Conclusion</strong></h4><p>Everybody wants to save time. When we create user experiences using Hick’s Law, we’re working to reduce the amount of time needed for a user to get done what they want to do. Combined with other guiding principles, Hick’s Law is a powerful way to understand user behavior and how users make the choices they do.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2Fb3e808%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2Fb3e808%2F&amp;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252Fb3e808%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/96d08ab34921bdd17986cb5c0396842f/href">https://medium.com/media/96d08ab34921bdd17986cb5c0396842f/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=4601b7dc0470" width="1" height="1"><hr><p><a href="https://uxplanet.org/what-web-designers-need-to-know-about-hicks-law-4601b7dc0470">What web designers need to know about Hick’s Law</a> was originally published in <a href="https://uxplanet.org">UX Planet</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Design Language System]]></title>
            <link>https://uxplanet.org/design-language-system-d438f4aa30e0?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/d438f4aa30e0</guid>
            <category><![CDATA[ux-design]]></category>
            <category><![CDATA[design-thinking]]></category>
            <category><![CDATA[design-language]]></category>
            <category><![CDATA[ux]]></category>
            <category><![CDATA[design]]></category>
            <dc:creator><![CDATA[Swetha Suresh]]></dc:creator>
            <pubDate>Wed, 28 Feb 2018 14:09:48 GMT</pubDate>
            <atom:updated>2018-02-28T14:25:26.466Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*VaWC3x_8oGhmGNUVpptzOQ.png" /></figure><p>Working in the design industry for the past few years, I have learnt to work with different departments towards the same goal. A complete fully functional product that is easy on the eye and provides a pleasant, if not out of the world, experience. Key to this is following a design language. Read along to find out about Design Language Systems and how you can begin to curate one.</p><h3><strong>Building a Design Language System</strong></h3><p>When you read ‘Design Language systems’ you might brush it off as something the design team should be thinking about, but that’s not the case and I’ll tell you why. First let’s define it.</p><blockquote><strong>Design Language System</strong></blockquote><blockquote>It is a set of rules or guidelines that heightens the level of harmony in a digital ecosystem.</blockquote><p>Now what is a digital ecosystem? It is nothing but interdependent group of enterprises, people or things that share a standardized digital platform for mutually beneficial purposes. To keep this ecosystem in harmony we need to understand the different groups involved, their requirements and expectations to build a wholesome design system that is scalable and efficient at the same time. This interdependent group of enterprises/people/things is where all of you (designers, developers) come in. All you should be doing is:</p><ul><li>Get everyone ready and on the same page.</li><li>Collaborate at healthy intervals to curate a wholesome design language system.</li><li>Keep in mind the collective desire to provide good user experience while adding to internal efficiency.</li></ul><p>The Design Language System is like setting a foundation for you to build on. It’ll make the build time shorter and much more efficient. Let’s start laying the foundation.</p><h4>Tools</h4><p>Standardize the tools different teams use in different phases of the project. Right from the discovery of the project through the design, development and validation phases. Make sure everyone is aware of the tools other teams use. Tools used for collaboration should be easily accessible and agreed upon by everyone in every team.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/486/0*3Nd5maT4ikP46rBY." /></figure><h4>Folder System</h4><p>Create a folder system to organize work. Standardize the naming convention. This will make it easier to find a particular file. Find a formula that works best for all the teams, perfect a naming convention and STICK TO IT.</p><h4>Documentation</h4><p>Document all these standardizations. Create a one stop shop for every information related to the system followed.</p><h4><strong>Style Guide</strong></h4><p>Conduct a UI Audit (If working on an already existing platform). This is essentially making an inventory of all the components that make up the digital product. All you have to do is take screenshots of all the elements and components that make up your product and categorize them. The components range from right, from the text to buttons and accordion to tabs.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/867/0*25fIOFvLKO4BY6bE." /></figure><h4><strong>Benefits of an UI Audit are</strong></h4><p>Consistency: To provide a consistent and cohesive experience</p><p>Documentation: So that there are no surprises while scaling/redesign/rebrand etc.</p><p>Retrofitting: To analyze the feasibility of responsive retrofitting.</p><p>Convinces your boss about a common interface language: This is important in larger organizations where multiple people work on the same project.</p><p>Groundwork for a Design Language System: It breaks down the product to its atomic level thereby helping to set up a style guide or a pattern library.</p><h4><strong>Other steps to make the style guide more useful :</strong></h4><h4><strong>Tool Box</strong></h4><p>Create a tool box of all the tools that are used to design along with plugins used. So, when there is a new member to your team all they need is the toolbox and they are set to maintain consistency.</p><h4><strong>Naming Conventions</strong></h4><p>Similar to naming folders, find a naming convention that works well for the team. Follow the convention to name layers, component and symbols.</p><h4><strong>Grid System</strong></h4><p>Set the grid system that works best for the product. It’ll help reduce the design decision time. Have one generic grid system and give yourself the liberty to modify based on requirement of every new product.</p><h4><strong>Typography &amp; Text Style</strong></h4><p>Fix on the typography and text style for faster visual design.</p><h4><strong>Pattern Library</strong></h4><p>This is essentially like breaking down a product into re-useable building blocks which can be categorized and grouped. This library will have details of every building block’s interdependencies and the set of rules which will a affect the way each block looks. The patterns will include everything from the text to buttons and accordion to tabs. For all the developers out there, your contribution to the pattern library is highly recommended as it has a monumental effect on the code base.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*hUmv3oTtvtILY-xI." /></figure><p>And like everything else in design, perfecting the design language system will and should be an iterative process. From this understanding its given that a design language system benefits more than just the design team. It greatly benefits the brand, the business and the end users.</p><h3>Benefits of a Design Language System</h3><p>In the previous part of this post we saw how we can build a Design Language System. Now lets see what benefits it brings along.</p><p>We established that Design Language System is a set of rules or guidelines that heightens the level of harmony in a digital ecosystem. Digital ecosystem consists of every interdependent group of enterprises, people or things that share a standardized digital platform for mutually beneficial purposes. Grouping these interdependent groups into three broad categories as Brand, Users and Business, lets see all the benefits that DLS brings to the table.</p><h3><strong>Brand</strong></h3><h4>Recognizability</h4><p>A DLS creates a personality for a digital product. A personality that has its own character and other quirks which gives it its own identity and allows it to be recognized in this over populated world of digital products.</p><p>Example: Facebook’s like button is it’s signature interaction. From its launch on Feb 9, 2009 to now, it has become imperative to the brand. Users recognize the ‘like’ button even when used out of context, in a third party site as a web beacon.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/480/0*gZbu_evG1106MzqW." /></figure><h4>Consistency</h4><p>Allowing the user to interact with consistent set of interact-able elements helps in defining the perception of the brand. This is always good as compared to a fragmented experience which a non-consistent product would provide. A good design language system understand the nuances of consistency and modifies elements and interactions based on context and does not over do consistency.</p><h4>Authenticity</h4><p>The claps on Medium to show appreciation for the article. Its unique and has not been done before, as opposed to likes and upvotes in other applications. This makes it authentic to Medium. When such authentic design language is followed consistently throughout a platform it creates recognizability for the brand.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/170/0*V63B8YLIpJAcWOGT." /></figure><h3>Users</h3><h4>Ease of Use &amp; Enjoyment</h4><p>This is a no brainer. The user’s experience is heightened when he interacts with consistent, easy flowing applications that he is able to recognize and carry out his functions with ease. His experience become pleasurable and enjoyable.</p><h3>Business</h3><h4>Efficiency and Cost</h4><p>Having a design language in place enables a team of designers, developers and every other interdependent group in the digital ecosystem to create, recreate, modify or iterate on a product in a quick and cost efficient manner. The end product will then align holistically with the product ecosystem. This level of efficiency can be credited to DLS.</p><p>Example : Karri Saarinen, Design Lead at Airbnb built and maintains Airbnb’s design language system. The goal his team set for the DLS was</p><blockquote><em>“ to create a more beautiful and accessible design language. We wanted our designs be unified to drive greater efficiency through well-defined, reusable and cross-platform components.”</em></blockquote><p>Since the DLS was now built, the developers could concentrate on building feature logic than spending their time on view code. This method worked out to be very efficient to the teams in Airbnb.</p><h4>Stability and Flexibility</h4><p>The DLS acts as a guiding light to every one in the ecosystem. It becomes a conscious effort by everyone in the ecosystem to align future builds with the DLS. This brings in stability. The design language system should be an iterative process, this ensures continued stability. The flexibility that DLS provides proves that it is here to stay as it evolves with time and context.</p><blockquote><em>A unified design language shouldn’t be just a set of static rules and individual atoms; it should be an evolving ecosystem.</em></blockquote><blockquote><em>- Karri Saarinen, Head of Design — Airbnb.</em></blockquote><h4><strong>Innovation</strong></h4><p>Once the DLS is implemented in the product or application it brings to light opportunities to make the product’s user experience better which will benefit the business. These opportunities create more ground for innovations.</p><p>The benefits of a Design Language Systems are endless and can be used not just in the digital ecosystems. Read the next part to read about an example of the Design Language System.</p><h3><strong>A Design Language System Example</strong></h3><p>In the first two parts of the #DLS series, we saw how to build a design language system and the benefits it brings along to the brand, users, and the business. In this part let’s see an example of a Design Language System, but before we jump into that, below is a comprehensive DLS checklist:</p><ul><li>Addressed to the entire digital ecosystem</li><li>Tools for everyone in the digital ecosystem</li><li>Naming Conventions</li><li>Folder System</li><li>Documentation</li><li>Style Guide with a UI Audit</li><li>Pattern Library</li><li>Tool Box</li><li>Grid System</li><li>Typography &amp; Text styles</li></ul><p>Benefits of a Design Language System as discussed before:</p><ul><li>Recognizability</li><li>Consistency</li><li>Authenticity</li><li>Ease of use</li><li>Cost effective</li><li>Improves efficiency</li><li>Stability and Flexibility</li><li>Innovation</li></ul><p>Let us now review the Atlassian’s Design System.</p><h4>Atlassian’s Design System</h4><p>From its very<a href="https://atlassian.design/"> landing page</a>, the system is addressed to every interdependent group in the digital ecosystem. A section for the<a href="https://atlassian.design/guidelines/brand/personality"> brand</a>, for<a href="https://atlassian.design/guidelines/marketing/overview"> marketing</a> and the<a href="https://atlassian.design/guidelines/product/patterns/comments"> products</a> itself, apart from guidelines for other aspects like the logos, colours, illustrations etc.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/0*xxZ_WQyhs3OZgb8n." /></figure><ul><li>The level of documentation that Atlassian’s design system provides with a very efficient holistic thinking covering all the interdependent groups shows inclusivity and throws light on their own culture.</li><li>They provide a<a href="https://atlassian.design/guidelines/product/resources/web-product-gui-pack"> web UI kit</a> that is available for download. Attention to detail is commendable.</li><li>They have a set of patterns documented and frequently keep updating this list. They make sure this is communicated to the users in a section called<a href="https://atlassian.design/guidelines/product/whats-new"> What’s new?</a> Staying pro-active in iterating the system adds value by staying relevant.</li><li>At Atlassian, they follow a<a href="https://atlassian.design/guidelines/product/foundations/grid"> grid system</a> to produce visually harmonious and coherent screens. The grid system is thoroughly documented and available for the public to see.</li><li>The<a href="https://atlassian.design/guidelines/product/foundations/typography"> typography</a> for different OS with the font stacks and its usage is documented and also available for download as a Web UI Kit.</li><li>The section about brand highlights the benefits that the system brings to its products.</li><li>The section for the<a href="https://atlassian.design/guidelines/brand/personality"> brand</a> addresses the personality that Atlassian’s products should reflect and the writing style the texts should follow. This personality gives its products recognizability and authenticity.</li></ul><p>Other examples of design language systems are :</p><ul><li><a href="https://polaris.shopify.com/">Polaris — Shopify’s Design System</a></li><li><a href="https://www.ibm.com/design/language/">IBM’s Design System</a></li><li><a href="https://airbnb.design/building-a-visual-language/">Airbnb’s Design Language System</a></li><li><a href="https://fluent.microsoft.com/">Fluent — Microsoft’s Design Language System</a></li><li><a href="https://design.trello.com/">Nachos — Trello’s Design Language System</a></li><li><a href="https://www.lightningdesignsystem.com/">Lightning Design System — Salesforce</a></li><li><a href="https://developer.apple.com/design/">Apple’s Design Language System</a></li></ul><p><em>Every day, a new Design Language System is built to make brands and businesses better and more efficient. Watch </em><a href="https://www.skcript.com/svr/"><em>this space</em></a><em> to learn about how </em><a href="https://www.skcript.com/"><em>Skcript</em></a><em>’s design team built its very own Design Language System.</em></p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2Fb3e808%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2Fb3e808%2F&amp;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252Fb3e808%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/96d08ab34921bdd17986cb5c0396842f/href">https://medium.com/media/96d08ab34921bdd17986cb5c0396842f/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=d438f4aa30e0" width="1" height="1"><hr><p><a href="https://uxplanet.org/design-language-system-d438f4aa30e0">Design Language System</a> was originally published in <a href="https://uxplanet.org">UX Planet</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[A designer’s UX review of the Hargreaves Lansdown app]]></title>
            <link>https://uxdesign.cc/a-designers-ux-review-of-the-hargreaves-lansdown-app-28a0d9bd23d9?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/28a0d9bd23d9</guid>
            <category><![CDATA[financial-services]]></category>
            <category><![CDATA[apps]]></category>
            <category><![CDATA[ux-design]]></category>
            <category><![CDATA[ux]]></category>
            <category><![CDATA[ui]]></category>
            <dc:creator><![CDATA[Simon McCade]]></dc:creator>
            <pubDate>Sun, 25 Feb 2018 09:56:00 GMT</pubDate>
            <atom:updated>2018-02-28T16:50:05.869Z</atom:updated>
            <content:encoded><![CDATA[<p>A few learnings from my recent experience with getting onboard with Hargreaves Lansdown’s updated financial services app.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*sSt_1wXS6h-Nh8yqWsJqbw.jpeg" /></figure><p>If I was to define my new year’s resolution for 2018, it’d be to become more organised with my personal finances.</p><p>Queue the vast amount of research that led me to make the decision to transfer my ISA from MoneyBox to Bristol-based financial services provider, Hargreaves Lansdown. I also opened a SIPP account with them.</p><p>The app and the website played key roles in my decision-making process (I can’t help it, I’m a designer), so here are a few notes as a review of the whole experience, in case you’ve got a similar resolution to do something about this year…</p><h3>The app</h3><p>After a recent redesign — well, overhaul — a raft of new features was introduced to the app (available for iPhone and Android). Disappointingly, the tablet version wasn’t part of this process, so it’s mobile-only.</p><p>Let’s look at the four areas of the app I think could still do with some work, especially if the tablet app is going to be updated for the purposes of brand consistency:</p><h3>Logging in</h3><p>As with many new apps, HL integrated Touch ID into its login functionality. It works very well, in my opinion. There’s scope for Face ID, too, if they update it for the iPhone X.</p><p>The downfall of this procedure, though, is in the lack of integration with other apps that help people recall their passwords if they haven’t memorised them, such as 1Password.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*l6Bd-QYX-RGNduwmZwN48g.png" /></figure><p>If you don’t have Touch ID or prefer not to use it, you have to enter three random characters from your password, which can be a frustrating system if you’ve opted for a long one.</p><p>The app could be more accommodating in this way, but perhaps updates are in the pipeline over at HL.</p><h3>My accounts</h3><p>The fact that you’re able to see your entire portfolio at a glance is super helpful and makes the app very easy to use and your investments very easy to access.</p><p>Clicking into a specific account allows you to see the detail you need in relation to gains and losses over time, but I can’t help but feel that it’s not granular enough. It could do with more filtering options to give you greater control over what you see on-screen.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*wBXXGDFkIzfp3v_H0KR7rA.png" /></figure><p>Charts and technical indicators could be included to bring the accounts to life and take advantage of landscape view in larger smartphones.</p><p>Another drawback is that it’s currently not possible to set up monthly savings or move funds between accounts; you have to go online or call HL direct to do so, which isn’t ideal for what should be basic tasks.</p><p>It’s also not possible to see broker forecasts, reports or accounts of certain stock and funds, so making smarter decisions on where to invest is made unnecessarily and slightly more difficult.</p><h3>Watchlists</h3><p>The app features the ability to organise your favourite investments into folders called Watchlists, which is one of my most-utilised features.</p><p>There are a couple of areas that are ripe for improvement here, too. I’d love to see total costs, including gains and losses for each of the Watchlists, and have the kind of organisational functions you have for subfolders as you do for bookmarks on Google Chrome (sub-Watchlists, if you will).</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ouztX5qX1Gq4WrA_fpdqWw.png" /></figure><p>Collaboration with others could also be possible here. If the app could facilitate shared Watchlists, you’d be able to collaborate on ideas to make smarter investments with your family and friends as well.</p><p>There are also a few discrepancies between the app and the website whereby this part of the service is still referred to as ‘Virtual Portfolio’, so that could do with clearing up to avoid confusing users.</p><h3>News</h3><p>HL makes good use of its news section to share its expertise and standing in the market, which I find very useful and informative.</p><p>Personalisation and accessibility would be key here, though. There’s currently no ability to filter or select my own sources of news and no features that are catered to those with impaired vision.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*42CKamr0NOG2DqrUyJZgCQ.png" /></figure><p>There are also no videos and few images to enhance the experience for people. The usefulness of the content would be vastly improved if, along with this, they introduced interlinking and improved bookmarking in the app. There’s too much manual work involved on the part of the reader as it stands.</p><h3>Summary</h3><p>Overall, there’s a pleasant experience to be had in an app that is this easy to navigate. It’s not difficult to find what you want, but this benefit could be even better with things like more detailed bookmarking.</p><p>From a design perspective, it looks clean and lends itself to a positive brand experience, but not for those with a tablet or those using different parts of the website.</p><p>There have been a few disappointed customers who have expressed the same kinds of frustrations I experienced, so it would be no surprise to see the developers and designers rectifying that in future updates.</p><p>The management of my personal finances has been improved on the whole thanks to this app, but I think there’s still work to be done on the small things to allow it to appeal to audiences on a bigger scale.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2F50d69a%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2F50d69a%2F&amp;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252F50d69a%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/05d5fd32eda31cbd1b83287606744532/href">https://medium.com/media/05d5fd32eda31cbd1b83287606744532/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=28a0d9bd23d9" width="1" height="1"><hr><p><a href="https://uxdesign.cc/a-designers-ux-review-of-the-hargreaves-lansdown-app-28a0d9bd23d9">A designer’s UX review of the Hargreaves Lansdown app</a> was originally published in <a href="https://uxdesign.cc">UX Collective</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Coffee & Ethnography]]></title>
            <link>https://medium.muz.li/coffee-ethnography-4ee31901286d?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/4ee31901286d</guid>
            <category><![CDATA[coffee]]></category>
            <category><![CDATA[research]]></category>
            <category><![CDATA[ux]]></category>
            <category><![CDATA[ethnography]]></category>
            <category><![CDATA[user-experience]]></category>
            <dc:creator><![CDATA[Busra Demirci]]></dc:creator>
            <pubDate>Sat, 24 Feb 2018 19:31:38 GMT</pubDate>
            <atom:updated>2018-03-01T04:27:16.220Z</atom:updated>
            <content:encoded><![CDATA[<h4><em>A step-by-step guide on how design professionals can orchestrate research to the tune of coffee.</em></h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*44r5wUt9jgoHronpuTCd4A.jpeg" /><figcaption>I hope you smirked at the fact that [coffee] and [ethnography] rhyme, ba dum tssss.</figcaption></figure><h3>Wait, what is Ethnography?</h3><p>Ethnography, or ethnographic research, can be defined as recording and analyzing a culture or society, usually based on observation and resulting in a written account of the subject.</p><p>User experience professionals are familiar with <strong>usability testing</strong> which focuses on physical, psychological, team, organizational, and political factors that play into how humans interact with technology. But, what happens when you need to ensure that implementing a technology is compatible with interpersonal dynamics and an ecosystem?</p><p>That’s where <strong>ethnography</strong> comes into the picture — it is performing usability research in a social environment.</p><blockquote>“First-hand participation in some initially unfamiliar social world and the production of written accounts of that world by drawing upon such participation [is the core of ethnographic research].”</blockquote><blockquote>— Emerson, Fretz, and Shaw</blockquote><p>It enables you to understand <em>how</em> you appropriately and effectively introduce technology to solve a problem/discover problems that you might not know exist.</p><h3>Roll up your sleeves</h3><p>Engage in <strong>contextual inquiry</strong> to passively observe and interview your users in their natural habitat.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/620/1*geBComuX6Am3OFjJ3I1Hbg.jpeg" /><figcaption>It’s just like a safari, but for the tech industry.</figcaption></figure><p>Key aspects of conducting this inquiry include: going where your users are, gaining a “day in the life” perspective, understanding your user’s natural environment, learning how they do things, and primary observation/documentation of activities.</p><p><strong>STEP 1 — </strong>Create a research plan— jot down what you want to study/understand.</p><p><strong>STEP 2 — </strong>Identify the audience you are targeting (personas).</p><p><strong>STEP 3 — </strong>Create a schedule and field guide. It’s helpful to have a few questions on hand that you know you want to address.</p><p><strong>STEP 4 — </strong>Set expectations. Let your participants consent/know why you are there and what you will be doing to them.</p><p><strong>STEP 5 — </strong>Observe your participants. Tip: Bring multiple team members with you to focus on key parts.</p><p><strong>STEP 6 — </strong>Ask questions. Probe your participants to clarify your observations.</p><h3>Now, what does this have to do with coffee?</h3><p>Well, Starbucks is the perfect place to practice your ethnographic research skills—it’s public, has a lot of traffic, and you can people watch without seeming like a creep.</p><p>As a result, my fellow UX’ers and I went to a local mall during our lunch break to perform this exercise.</p><p>We decided to observe and log the <strong>customer experience</strong> of a kiosk-style Starbucks in the center of the mall.</p><p>We got settled in with our notebooks/pens and quietly just watched for a few hours to understand what type of data we could quantify/collect.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/400/1*1UR9fOoxd1UMwcN8xnDAqg.jpeg" /><figcaption>Taryn and I ready for the caffeine prowl.</figcaption></figure><h4>What we were looking for</h4><ul><li>Artifacts</li><li>Hindrances</li><li>Inconsistencies</li><li>Distractions/disruptions</li><li>Workarounds</li><li>Dependencies</li><li>Bottlenecks</li><li>Behavioral patterns</li><li>Opportunities</li></ul><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2F8153c7%3Fas_embed%3Dtrue&amp;url=https%3A%2F%2Fupscri.be%2F8153c7&amp;image=https%3A%2F%2Fupscri.be%2Fmedia%2Fform.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/365d4e2e268702353cc960e6b5f12046/href">https://medium.com/media/365d4e2e268702353cc960e6b5f12046/href</a></iframe><h3>Our Observations</h3><h4>The external experience:</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*OEl6c1pYjPr3j2aLA1WWiw.jpeg" /><figcaption>Wide spaces and sectioned seats to lounge in.</figcaption></figure><p>Lots of cozy seating, tables, and a water fountain nearby. Open atmosphere for people to lounge and enjoy their beverages/snacks.</p><h4>The setup:</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*-FMVSr5AZepspcjDanAR2A.jpeg" /><figcaption>The Kiosk where customers lined up to order. A menu with some seating was on the back side.</figcaption></figure><p>The kiosk had a cornered off line in front where customers lined up to order their drinks. At the far right was a pickup area with napkins, trash cans, sugar, milk, etc.</p><p>Environmental artifacts included baskets along the line filled with snacks and water bottles, a shelf of coffee/gift items, and a pastry/food fridge area. Customer artifacts/hindrances included purses, shopping bags, cell phones, glasses, headphones, notebooks, backpacks, and kids/family members.</p><h4>Trends</h4><ul><li>The time of day directly affected whether people purchased coffee, tea, or baked goods (not as popular later in the day after lunch).</li><li>Signage for pickup of prepaid orders (Jump the Line) was in an inconspicuous place and hard for customers to acknowledge/see.</li><li>The kiosk is not named intuitively in the phone app, apparently it’s called (“The Terrace”)—zero customers ordered ahead because the coffee was an impromptu purchase or they couldn’t locate the shop on their phones.</li></ul><figure><img alt="" src="https://cdn-images-1.medium.com/max/800/1*CWd-LLlFF2q-qephiT4Y1g.jpeg" /><figcaption>Collecting our notes and sorting them into events.</figcaption></figure><h3>Our Findings</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/364/1*xPCjeq6itY84PzUW19sqVQ.png" /><figcaption>Customer age distribution based on a sample of 50.</figcaption></figure><p>The <em>average</em> time it took a customer to order, pay, and pickup his/her order was about <strong>3.55 minutes</strong>.</p><p>Customer ages varied widely. The flow of customer types and traffic that we encountered was also directly affected by the time of day.</p><p>Our location also influenced our stats, we want to visit more to see how the data holds up.</p><p>Among the customers, <strong>33%</strong> paid in cash, <strong>33% </strong>paid using credit, and <strong>40%</strong> paid using their cell phones.</p><h4>The journey</h4><p>A <strong>journey map</strong> visualizes the process that a person goes through in order to accomplish a goal. Plotting out the emotional landscape along the customer’s path sheds ­­­­light on key opportunities. This tangible, “bird’s eye” view of data helps communicate trends and events.</p><p>When putting this piece together, I denoted key points, actions/events, and emotional states we found during the customer process.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*v43OdOTFHasORVDxdQ0Eug.png" /><figcaption>The journey was broken down into three phases with insights into each step of the process.</figcaption></figure><p>The next step would be to collect information on other roles (baristas, drink makers) and take the pain points to come up with solutions that streamline the process. Starbucks already does a great job at customer service, but small improvements pave a path to efficiency and optimal experience.</p><h3>Your turn</h3><p>The best way to hone your skills is to go out and <strong>practice</strong>. Try to find opportunities and fun ways to incorporate research and observation into your daily life.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*K9mC8bd9V9HUfG-dXPljiw.jpeg" /></figure><p>In the field, we would have collected more robust data (i.e. tying payment methods to age groups, etc).</p><p>This time around, we just wanted to get some fresh air and flex our research skills while enjoying some delicious coffee.</p><p><strong>In case you’re wondering</strong> — we both used our phones to purchase our beverages (rewards points, ftw).</p><figure><a href="https://muz.li"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*kBBb0Yj_PHq8r-ynU9bwJw.png" /></a></figure><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=4ee31901286d" width="1" height="1"><hr><p><a href="https://medium.muz.li/coffee-ethnography-4ee31901286d">Coffee &amp; Ethnography</a> was originally published in <a href="https://medium.muz.li">Muzli -Design Inspiration</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Prototyping inside Sketch 49 — Learn how it works and what you can do ]]></title>
            <link>https://medium.com/sketch-app-sources/prototyping-inside-sketch-49-how-it-works-and-what-you-can-do-7a48c829f282?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/7a48c829f282</guid>
            <category><![CDATA[prototyping]]></category>
            <category><![CDATA[ui]]></category>
            <category><![CDATA[sketch]]></category>
            <category><![CDATA[design]]></category>
            <category><![CDATA[ux]]></category>
            <dc:creator><![CDATA[Sketch App Sources]]></dc:creator>
            <pubDate>Wed, 28 Feb 2018 12:17:21 GMT</pubDate>
            <atom:updated>2018-02-28T13:46:08.536Z</atom:updated>
            <content:encoded><![CDATA[<figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ALa-3cIhtSgXPefix38srQ.png" /></figure><h3>Sketch 49 brings home one of the most anticipated and desired features — the ability to create and share quick interactive prototypes natively.</h3><p>Over the years Sketch’s amazing third-party developer community has made Sketch an incredibly extensible design toolkit. As a result, we can enjoy dozens of great companion products and prototyping plugins such as Protowire, Craft, Mirr, Principle, Framer, Flinto, Flow, Marvel, Atomic, Kite, Origami, CanvasFlip, Proto, and ProtoPie, just to name a few.</p><blockquote><strong>“</strong>Would you bring prototyping to Sketch?” was perhaps the most frequently asked question in forums and during design meetups. Today, Sketch answered this questions with a big and bold, “Yes.”</blockquote><figure><img alt="" src="https://cdn-images-1.medium.com/max/250/1*M9fJBvbfC2Uo0rQJgZIRTg.gif" /><figcaption>Native prototyping is finally here.</figcaption></figure><p>Keeping things simple has been a consistent theme for Sketch and an important differentiator between other design tools and Sketch. We live in the age of information overload and that comes with growing list of expectations and requirements for designers, developers, and product people. The evolution of interaction design, the pressure to ship fast and fail safe, as well as the desire to reuse components is really pushing the idea of doing more with less or using one tool for many important purposes.</p><p>There are dedicated interaction prototyping tools with advanced animation capabilities, timeline and keyframe features, and easing functions. Prototyping inside Sketch is simple but awesome! You will not find advanced animation features, yet. This is sometime to keep in mind when you explore this first version.</p><h3>So, what does prototyping look inside Sketch?</h3><p>There is a helpful getting started guide which you can find under <strong>Sketch &gt; File &gt; New from Template &gt; Prototyping Tutorial</strong>. We will briefly look at this guide and prototyping features.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2F5bsptX8MdPg%3Ffeature%3Doembed&amp;url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3D5bsptX8MdPg&amp;image=https%3A%2F%2Fi.ytimg.com%2Fvi%2F5bsptX8MdPg%2Fhqdefault.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=youtube" width="854" height="480" frameborder="0" scrolling="no"><a href="https://medium.com/media/297ec1938452d19c69b9d68e703791d8/href">https://medium.com/media/297ec1938452d19c69b9d68e703791d8/href</a></iframe><h3>New Icons &amp; Prototyping Shortcuts</h3><p>When you open the <a href="https://sketchapp.com/updates/">latest version of Sketch</a> you might notice these icons.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/824/1*NANF9a6zi-6xEnkoe_MIOw.png" /></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/22/1*KeJtC4KDpYk3mIlokmyF_Q.png" /><figcaption>Press <strong>W</strong> to add a link to a layer or group</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/20/0*fJsUeEeUdN4DS5aN." /><figcaption>Press <strong>H</strong> to insert a Hotspot layer</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/22/0*RSkOzm9pfy4I0L7S." /><figcaption><strong>Control + F </strong>will hide/show prototyping</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/18/0*FloEFDGyTbdk89tX." /><figcaption><strong>Command + P </strong>will open Preview</figcaption></figure><p>Similarly to Symbol layers, Link and Hotspot layers are designated with custom folder icon in the Layer List on the left.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*7h0EbJEKjnYVURI35MUnIQ.png" /><figcaption>Showing Button with Hotspot in the Layer List</figcaption></figure><h3>The Inspector and Animations</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/592/1*R3-JhinZefhUz9_jtMWCBg.png" /></figure><p>Selecting a layer will reveal a new Prototyping section in the Inspector. Here you’ll be able to create and delete Tap Targets. Furthermore, you will be able to select from few basic Artboard transitions at the moment:</p><p>❇ No Animation<br>←Animate Artboard from Right<br>↑ Animate Artboard from Top<br>→ Animate Artboard from Left<br>↓ Animate Artboard from Bottom</p><h3>Links and Hotspots</h3><p>In order to create a prototype you will need the latest version of Sketch along with several Artboards in your document. You can then connect Layers or Symbols (which is very powerful when you consider Nested Symbols) to different Artboards with Links and Hotspot Layers. Take a look the the example below in which we connect the trailer thumbnail to the Player Artboard with <em>Animate Artboard from Top</em>.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*s4WQxgMThacEOfGrKiBmJQ.gif" /><figcaption>Creating Links and Hotspots</figcaption></figure><figure><img alt="" src="https://cdn-images-1.medium.com/max/488/1*AW0mrk0VpE7poj9sFai_Sg.gif" /><figcaption>Press <strong>H</strong> to insert a Hotspot layer</figcaption></figure><p>Hotspot is a type of layer that allows you to draw a shape, a tap target, over a part of your design and link it to an Artboard. More importantly, Hotspot Layers can belong inside Symbols where their target destination can be overridden. You can see how each Hotspot can be customized with overrides in the example below. You can also convert a Link to a Hotspot by selecting the layer and clicking the Create Hotspot icon in the Inspector.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*vznEPaZDdGj3HevT_-bX2g.gif" /><figcaption>Hotspot Layers inside Symbol</figcaption></figure><h3>Preview</h3><p>When you Preview your prototype, you might also notice a small flag icon. This is a Start Point marker and it allows you to select the Artboard from where you would like to start your prototype. It’s especially helpful for documents with many Artboards. So, in order to set a Start Point, you first need to Preview the Artboard and click on the flag icon.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*zxiFsX2CPlmU-a4-Fkqllw.gif" /><figcaption>Prototype Preview</figcaption></figure><h3>Long Views aka Scrolling Artboards</h3><p>More than often we need to display content such as news feed or lengthy transaction details. In this case, we can simply create a longer Artboard to show off a view that will scroll. When Previewing your prototype, longer Artboards automatically scroll according to the Artboard’s preset.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*VztO3aocvwitpyLXnxdTNg.gif" /><figcaption>Scrolling View in Sketch Preview</figcaption></figure><h3>Prototype Feedback and Collaboration</h3><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*57XU160JKGrDd-toD6zr2g.png" /><figcaption>Prototype in Sketch Cloud</figcaption></figure><p>Once you’ve defined a Start Point and have cleaned up your prototype, you can share it on Sketch Cloud. With Sketch Cloud you can quickly review and comment on designs and prototypes. Your colleagues and friends will be able to do this with a unique link.</p><p>Furthermore, if you’re demoing your prototype to a small audience, you can use Sketch Mirror to preview your prototype on the device it was designed for. Sketch Mirror is an iOS counterpart app which allows you to preview your designs near real-time on an iPhone or iPad. When you launch Mirror on iOS, you will see a connection notification on the top-right corner or Sketch’s window. Click that to connect.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*lLv631dbMrbo0YGuTLiPgg.png" /><figcaption>Sketch Mirror, an iOS counterpart app, for previewing designs and prototypes via Wi-Fi andUSB Lightning cable.</figcaption></figure><p>Version 49 also brings Shared Libraries on Sketch Cloud and so much more. Check out all that’s new in this blog post.</p><p><a href="https://blog.sketchapp.com/prototyping-libraries-on-sketch-cloud-and-an-official-ios-ui-kit-in-sketch-49-bf090c70796c">Prototyping, Libraries on Sketch Cloud and an official iOS UI kit in Sketch 49</a></p><p>Design + Sketch and <a href="https://www.sketchappsources.com/">Sketch App Sources</a> are dedicated to bringing you the best of Sketch. Discover over 3000 resources from designer and developers around the world. When you create your next Sketch design or prototype, consider sharing it with the community.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2F81a3f5%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2F81a3f5%2F&amp;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252F81a3f5%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/76b36c6b62c2e2ee9fe4fdfd6e3d68ee/href">https://medium.com/media/76b36c6b62c2e2ee9fe4fdfd6e3d68ee/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=7a48c829f282" width="1" height="1"><hr><p><a href="https://medium.com/sketch-app-sources/prototyping-inside-sketch-49-how-it-works-and-what-you-can-do-7a48c829f282">Prototyping inside Sketch 49 — Learn how it works and what you can do 🔥🎉🚀</a> was originally published in <a href="https://medium.com/sketch-app-sources">Design + Sketch</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[UX design vs Phone voice]]></title>
            <link>https://uxdesign.cc/ux-design-vs-phone-voice-a272447eb984?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/a272447eb984</guid>
            <category><![CDATA[design]]></category>
            <category><![CDATA[user-experience]]></category>
            <category><![CDATA[user-experience-design]]></category>
            <category><![CDATA[online-business]]></category>
            <category><![CDATA[sales]]></category>
            <dc:creator><![CDATA[Mila Kosa]]></dc:creator>
            <pubDate>Wed, 28 Feb 2018 16:49:46 GMT</pubDate>
            <atom:updated>2018-02-28T16:49:46.019Z</atom:updated>
            <content:encoded><![CDATA[<p><strong>On the grounds of ‘The Wolf of Wall Street’</strong></p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*xLpKibndmcFqce1yWyp_Ww.jpeg" /></figure><p>Each of us in our own time was amazed by the brokers who sold the shares for thousands of dollars by phone.<br>It looked quite weird — <strong>how is it even possible</strong> that you did not plan anything like that a minute ago, and after the call of a stranger you decide to part with all the savings?</p><p>Notably, it was about everyday people, and not professional investors with whom brokers closed the deal, giving a feeling of a unique opportunity and quick profit with the minimum participation required — the broker is ready to do that stuff, all you need is just to open an account.<br>Recall that this was especially true in the 80’s, when the fashion for the stock market operations came into being, and every second thought it was an easy and fast way to get rich.</p><p>Gathering some information about the customer <em>(hello, Big Data)</em>, the brokers selected just the right keys to reduce the ‘pain threshold’ from parting with money.<br>One was told that their grandfather had made a fortune on these shares, others were asked to imagine how they would put a deposit down on a new house in a month or send their children to college.<br>So the persuasion worked, and so the deals were closed.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*BM6jMZASZzz8lkA0us7jHw.jpeg" /><figcaption>Photo by <a href="https://unsplash.com/photos/M-3QjN7PONM?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Charisse Kenion</a> on <a href="https://unsplash.com/?utm_source=unsplash&amp;utm_medium=referral&amp;utm_content=creditCopyText">Unsplash</a></figcaption></figure><p>Today the things are pretty much different, as we make most of the purchases in the process of communicating with the interface, which came to replace the voice of the seller in the handset.<br>Imagine if these guys from the 80’s had the opportunity to visualize the future ‘dolce vita’ for the buyer that will come after buying the shares!<br>So, what do we need today to make a purchasing decision? What does eventually convince us to do this?</p><p><a href="https://en.wikipedia.org/wiki/Jordan_Belfort">Jordan Belfort</a> (played by <a href="https://en.wikipedia.org/wiki/Leonardo_DiCaprio">Leonardo DiCaprio</a> in the movie <a href="http://www.imdb.com/title/tt0993846/">“The Wolf of Wall Street”</a>) formulated 10 steps, which according to his system of direct sales (<a href="http://jordanbelfort.com/">Straight Line Selling</a>) will lead to the closed deal.<br>Okay, today we do not call by the phone, but what if we use his advice to close the deal using the interface?</p><p>Here we go.</p><p><strong>1. Intro.</strong><br>The first few seconds that you have to show the user that you are ‘<em>Sharp as a tack</em>’, ‘<em>Enthusiastic as hell</em>’, and ‘<em>Figure of Authority</em>’.<br>This task on a web page is performed by a welcome slide, usually with a teaser in the form of an image or video that creates both a general atmosphere and a first impression of the team and its product.</p><p><strong>2. Develop instant rapport. </strong><br>You express a genuine desire to help the user solve his problem and take care about him, but not just sell something. After all, you understand the essence of his problem, and how amazing it would be to get rid of it.<br>Therefore, a web page does not need to immediately talk about your offer. You should first describe the problem solved by the product, and show a complete understanding of the user’s desire to be out of it.</p><p><strong>3. Gather intelligence. </strong><br>Ask questions because in this way the user understands that you are really concerned about his problem and are looking for the best option, trying to understand what he really needs.<br>On a web page it can be apt forms or some kind of ‘free consultation’ offer. By the way, this is why interactive web pages always work better than the static ones, since interaction already implies a certain degree of personalization.</p><p><strong>4. Run-up for proposal. </strong><br>The user is still here, so probably he is interested, and it’s time to move on to presenting our solution to his problem.<br>But first let’s make an atmospheric and emotional inset on the web page before the direct presentation of the product in order to ease the tension.</p><p><strong>5. Product presentation. </strong><br>We do not sell anything yet, we just show what kind of solution we can offer the user and explain what makes it so unique. At the same stage, we present the company that offers this solution, and explain why exactly these people are selling exactly this solution.<br>On a website it can be a list of features that strongly promote your product. Also, if possible, mention the team’s experience in solving similar problems.</p><p><strong>6. First motion. <br></strong>Finally, we show our solution at its finest, and reveal the price. For example, we can show different plans and the list of available features associated with each plan.</p><p><strong>7. Steady interest. </strong><br>The user is not ready to spend money right away? No problem, if he really likes the product, you give the access simply at no cost!<br>Yes, this is that same trial access for a limited amount of time.</p><p><strong>8. Certainty. </strong><br>We need to bolster confidence that the user really deals with experts and enthusiasts of their business.<br>This can be a description of the additional product benefits and fine details, as well as feedback from other users who have already made a purchase.</p><p><strong>9. Doubts.</strong><br>They need to be denied, clearly proving that the user will benefit from buying a product more than he risks losing, even if it fails.<br>Try to focus on specific cases that your product helps to solve. The benefits of buying a product should be as clear as daylight.</p><p><strong>10. Pain. </strong><br>We must articulate the pain that will remain with the user who has not bought our product yet. <br>It should not be very intense, but still sensitive, so that eventually he realizes how much he wants to get rid of it.<br>For example, we can show with what difficulties the user will continue to face if he refuses to buy and leave everything as is.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*sjdwauiR9kpqHb8kl6ZOAw.jpeg" /><figcaption>Jordan Belfort, the author of ‘Straight Line Persuasion’</figcaption></figure><p>You see, actually the more it changes, the more it remains the same.</p><p>To be fair, these guys from the 80’s successfully used this technique to sell frankly poor products (say, shares of fake companies), but I am sure you already know that this is a bad role-model.</p><p>Though, a good product usually also requires some effort to be sold, and moreover it gives you the opportunity to not just close the deal, but also to get a loyal customer who will return again and again.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2F50d69a%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2F50d69a%2F&amp;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252F50d69a%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/05d5fd32eda31cbd1b83287606744532/href">https://medium.com/media/05d5fd32eda31cbd1b83287606744532/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=a272447eb984" width="1" height="1"><hr><p><a href="https://uxdesign.cc/ux-design-vs-phone-voice-a272447eb984">UX design vs Phone voice</a> was originally published in <a href="https://uxdesign.cc">UX Collective</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[Plan to learn]]></title>
            <link>https://uxdesign.cc/plan-to-learn-5b954f0599d?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/5b954f0599d</guid>
            <category><![CDATA[design]]></category>
            <category><![CDATA[ux]]></category>
            <category><![CDATA[user-research]]></category>
            <category><![CDATA[product-design]]></category>
            <dc:creator><![CDATA[Péter Balázs Polgár]]></dc:creator>
            <pubDate>Wed, 28 Feb 2018 16:51:02 GMT</pubDate>
            <atom:updated>2018-02-28T16:51:02.452Z</atom:updated>
            <content:encoded><![CDATA[<h4>Well designed research plans in qualitative user research help to successfully learn about users</h4><p>I love user research. I’m fascinated with talking to people and observing them while they do their stuff. I’m fascinated so much, sometimes I almost forgot why I’m there: to learn about a specific question we set out to answer. Research plans remind me to focus on the important questions.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*t_B7Xw-lencY0Jqs6xU1Iw.png" /><figcaption>Heroes need plans</figcaption></figure><h3>Research plans</h3><p>User research plans come in all kinds of flavour. They vary from a simple script containing a few questions to ask, to a strategy on which methods to use and how the insights build up from the initial questions to the final report. I like to refer research plan as something in the middle, driving one qualitative study with a handful of participants.</p><p>There are a <a href="https://www.smashingmagazine.com/2012/01/ux-research-plan-stakeholders-love/">number</a> <a href="https://www.nngroup.com/articles/pm-research-plan/">of</a> <a href="https://blog.prototypr.io/why-you-need-a-user-research-plan-19caf4438a35">excellent</a> <a href="http://adaptivepath.org/ideas/e000107/">resources</a> on planning simple studies, but you don’t even need that many points, especially if you are working with <a href="https://svpg.com/continuous-discovery/">continuous discovery</a>.</p><p>The perfect research plan only needs five elements:</p><ol><li>Goal: why are we doing this research, what are we hoping to get out of it.</li><li>Research questions: what are specific questions we are interested in.</li><li>Method: what specific method we want to use to learn about the questions.</li><li>Participants: what’s the user profile we are looking for.</li><li>Protocol: how we want to conduct the session.</li></ol><p>You would want to also add a specific title, like “2018–02–29 Onboarding user interview” so you can differentiate from your other plans, and your name in case somebody has questions on the details later on.</p><h4>Goal</h4><p>The study’s goal is sometimes hard to set, as people get so excited that they would jump straight to writing up their questions. Stepping back and thinking about the purpose is important as it provides you the lens for filtering questions and deciding on participants and research method. If you don’t define your goal, what you want to learn and achieve with this study, you’ll never know for sure if you succeeded.</p><p>Defining the goal should be done by collaborating with the stakeholders (for example product managers). Such discussions also help to uncover assumptions, and risky areas in a project that would need further investigation with other methods.</p><p>A great goal shouldn’t be more, than 2–3 sentences and should clearly state what is the experience, workflow or task you wish to learn about, what aspects are important, and also what you hope to achieve with this knowledge.</p><h4>Research questions</h4><p>A list of questions on what you intend to learn with the research. I like to set this list as wide as possible, as long as the questions are within the scope defined by the goal. Sometimes not every questions is possible within one study, or even important to answer. But users tend to have the ability to tell you things you didn’t expect, so thinking about what else could be interesting will help you recognize a piece of interesting insight from a word the user randomly utters.</p><p>Research questions can be quickly brainstormed with project participants, after making sure everyone has a shared understanding on the goal. I usually find not only product managers or designers, but also engineers have excellent questions.</p><p>A great list of research questions are specific, not overly general and focus on new information to learn about the users (as opposed to learn something we can get from market research or analytics).</p><h4>Method</h4><p>Once you have your goal and your research questions, you can decide which method to use. That is, which method will be the most suitable to answer your questions. For generative research the most common answer is some type of user interview, but there are <a href="https://www.nngroup.com/articles/which-ux-research-methods/">plenty of possibilities</a> to choose from.</p><p>Describing your method in a few sentences also helps team members and stakeholders understand how you will work. And maybe how you expect others to participate in the sessions, or how will they learn about the results.</p><h4>Participants</h4><p>With your goal, research questions and method set the user profile you want to research with. This can be even some demographics or a persona description, but the best is to describe it with behaviours, so “users who do x”. Maybe even some hard metrics, like “shopping 4 times per week”. Specific info here will help in setting up the recruitment screener and make sure you get the right type of participants. These specifics can be written based on the goal.</p><p>Choosing a somehow restricted user profile has an other benefit. If you cannot find participants for your research it may very well be that the original problem you set out to research is not really a problem at all, so gives an early validation on your product or feature idea.</p><h4>Protocol</h4><p>I see protocol sometimes confused with the research questions. In essence research questions are what you want to learn, while protocol is how you will learn it. Protocol is a guide on how to facilitate the user session, especially in case of a user interview or similar methods where you interact with the user directly.</p><p>Why you need a protocol, if you already have your research questions? Unfortunately just plainly asking the users what you want to learn will probably lead to biased information, in some cases even falsehoods. For example an always interesting question is how much users are willing to pay for a product and if they would use it. If you ask this from the users though, it’s unlikely you will get an informative answer, as people are not really good at predicting their own future behaviour. So protocol should contain most of you research questions in a well formulated way.</p><p>A good protocol does a few other things besides containing a set of well-formed questions:</p><ul><li>Gives a logical structure to your session.</li><li>Defines time allocation (for example if you have limited time for an interview).</li><li>Has an exact, word-by-word description what you need to tell in the beginning of the session (like you will do a recording), and at the end of the session (like how you will handle the incentive).</li><li>Helps not only in the session, but also in the note taking.</li></ul><p>Protocol doesn’t need to be followed linearly, it’s a guide you can lean on while you facilitate the session.</p><h4>The rest</h4><p>There may be some additional elements in a research plan, however I find these are optional and not needed in all studies.</p><ul><li><strong>Hypothesis</strong>: Assumptions, hypotheses, validation brought much rigour into user research, and shaped product discussions into a more well thought-out direction. But at the same time with qualitative research it’s though to talk about validation, as you collect a limited number of facts. Still, talking about hypotheses might be useful as it opens up discussions on what we think we know and might bring in new questions.</li><li><strong>Prototype</strong>: If you have something to show to the user to discuss about, it’s worth preparing and linking the proto upfront, so you can find it.</li><li><strong>Time frame</strong>: Qualitative research might not have a definite end, even if patterns already emerge you learn new details all the time for a specific set of goal + questions. It’s probably worth to time box the efforts, and instead of doing one long study, stop after a few weeks, do a round of synthesis and plan an other study based on what you’ve learned.</li><li><strong>Recruitment</strong>: Details, such as the screener or where the advertisement was posted may be worth noting, as these might uncover how data can be possibly biased.</li><li><strong>Budget</strong>: Depending on how you allocate your budget, recruitment and incentive fees other costs like renting a facility might be important to note.</li></ul><h3>What you cannot plan for</h3><p>One important thing to know about plans: they tend to not behave exactly how we intended them to behave during usage. Or, as <a href="https://en.wikipedia.org/wiki/Helmuth_von_Moltke_the_Elder">Helmuth von Moltke the Elder</a> put it:</p><blockquote>No battle plan ever survives contact with the enemy.</blockquote><p>Though research plans is not about contacting the enemy, it still concerns humans, so a number of things can go wrong.</p><ul><li><strong>Goal</strong>: You didn’t learn what you wanted to learn. Once cause could be that the questions, the participants, the method or the protocol didn’t remain in the scope the goal defined. It can also happen the initial goal didn’t make sense, try to learn about it in some other way, like desk research.</li><li><strong>Research questions</strong>:<strong> </strong>The questions were not the one you were interested in after all. This can especially happen at the beginning of the projects, when the even the scope is unclear, and as you begin to talk to users, they will shift your focus into a different direction.</li><li><strong>Method</strong>: Some methods may not work for certain contexts, which is difficult to predict if this is a new topic for the researcher. For example in a certain domain users are way less likely to share or willing to talk, so some other method should be chosen.</li><li><strong>Participants</strong>: Users arrive perfectly fitting the profile, but they are not the ones you were looking for. Maybe the profile was too strict or loose. Maybe the type of user you had in mind does not exist. Maybe the profile was not clear, and it resulted in a misunderstanding with the recruiter.</li><li><strong>Protocol</strong>: The users don’t answer your questions, or give biased answers (which is by the way difficult to detect), or are puzzled by your questions. Protocol questions may need to be reformulated several times until you get to a version, which help you to learn actionable insights.</li></ul><p>All in all, research plans, especially for qualitative research shouldn’t be set in stone. You should learn from each session you conduct, and iterate on your plan.</p><h3>Planning to learn</h3><p>A well crafted research plan guides you during sessions and helps in learning about the user, but don’t forget it just guides. Sometimes the best insights are gathered when you deviate from your plan.</p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2F50d69a%3Fas_embed%3Dtrue&amp;dntp=1&amp;url=https%3A%2F%2Fupscri.be%2F50d69a%2F&amp;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252F50d69a%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0" scrolling="no"><a href="https://medium.com/media/05d5fd32eda31cbd1b83287606744532/href">https://medium.com/media/05d5fd32eda31cbd1b83287606744532/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=5b954f0599d" width="1" height="1"><hr><p><a href="https://uxdesign.cc/plan-to-learn-5b954f0599d">Plan to learn</a> was originally published in <a href="https://uxdesign.cc">UX Collective</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
        <item>
            <title><![CDATA[How to Make an iOS Fitness App: 12 Tips Checklist]]></title>
            <link>https://medium.com/swlh/how-to-make-an-ios-fitness-app-12-tips-checklist-680bbbbaba89?source=rss-------8-----------------digital_design</link>
            <guid isPermaLink="false">https://medium.com/p/680bbbbaba89</guid>
            <category><![CDATA[fitness]]></category>
            <category><![CDATA[ios-app-development]]></category>
            <category><![CDATA[start]]></category>
            <category><![CDATA[mobile-app-development]]></category>
            <category><![CDATA[fitbit]]></category>
            <dc:creator><![CDATA[Tecsynt Solutions]]></dc:creator>
            <pubDate>Tue, 20 Feb 2018 11:05:23 GMT</pubDate>
            <atom:updated>2018-02-28T12:54:08.178Z</atom:updated>
            <content:encoded><![CDATA[<p>While the mobile industry grows, our devices become our personal assistants. Nowadays, smartphone apps can give us a hint on the medical treatment or teach us a new language. No prizes for guessing how easy it is for our mobile phones to become personal coaches.</p><p>Fitness apps are not a fashionable trend — it’s more like a necessity to achieve certain goals and become a healthy individual. We continue a research in mobile fitness app development, and today’s article is about main steps to make before launching your own fitness solution.</p><h3>Starting with a Research to Make an iOS Fitness App</h3><h3>1. Define your target audience</h3><p>First of all, who exactly will use your product? You should be sure that people really need the app you’re going to offer them. As there are several types of fitness apps on the market, their target audiences differ to a certain extent.</p><p>On this research stage, it’s better to use as many data sources as possible. You may start simple with analyzing the market and finding apps similar to yours especially if they have high ratings (for example, Fitbit or MyFitnessPal). Then, go further and look for some numbers on Statista or Google Trends. And finally, use such services as ProductHunt where you can place your idea and get a feedback from potential users. Those who will be interested in your app are your future loyal customers.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/664/0*xqjq1FPRdvFDzy0O.jpg" /></figure><h3>2. Pass your idea to tech professionals</h3><p>The application you’re going to present to the market will definitely require lots of work to be done and constant updates afterwards. With this concept in mind, think about hiring a remote team of professional developers. It is way less expensive than hiring an in-house team, and you yourself can focus on the business idea and work on a marketing concept while your product is being developed.</p><p>Additionally, looking for technicians working remotely, the whole world will be open for you. And as <a href="https://tecsynt.com/blog/research-and-development/software-development-costing-and-hourly-rate">developers have different hourly rates depending on the country</a>, you can adjust the app price to your budget.</p><h3>Setting Up the Development Work to Make an iOS Fitness App</h3><h3>3. Pay the most of your attention to UX and UI</h3><p>The importance of a thorough design elaboration is widely discussed in the mobile app development community. More applications appear in the App Store every year, and this fact makes users pickier about the product they download. That’s why coding should be based on a perfect design. Besides, Apple has its own <a href="https://developer.apple.com/ios/human-interface-guidelines/overview/themes/">Human Interface Guidelines</a> which should be a foundation of your app’s visual representation.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/664/0*nbVIxOqHmVSDGGmK.jpg" /></figure><p>Source: <a href="https://dribbble.com/shots/4051946-Menutri-Fitness-food-app">Dribble</a></p><h3>4. Focus on certain devices</h3><p>Earlier, it was considered that iPad responsiveness was more important for business apps. Nowadays, any application should be adapted to the size of any screen, including both iPhone and iPad devices. And you should not forget that fitness apps are often used on the Apple Watch, so it can be a perspective development path for your business.</p><h3>5. Benefit from iOS fitness app libraries and frameworks</h3><p>iOS libraries and frameworks are very convenient instruments which can be used in many cases for your project. You should also know that they can reduce the cost of your application as it lowers the number of efforts to create a new app. These tools are available on GitHub, and they are mostly open-source solutions, so anyone could contribute to a huge iOS ecosystem.</p><h3>6. Learn more about healthy nutrition services API</h3><p>Diet and nutrition apps are one of the most popular types of fitness apps. They may concern many aspects of people’s everyday habits: a number of calories (either burned or taken), water intakes, logging body weight, etc. As there are many options, one can find lots of ready-made APIs on the web for the future work.</p><h3>7. Provide the list of fitness programs and exercises</h3><p>This point concerns another fitness app type which is the workout application. If you choose it, your product should be very informative and motivational for users. And first of all, it’s about sets of exercises with detailed instructions on how they should be performed.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/661/0*YufGf_ZJqSY6rjLU.jpg" /></figure><p>Source: <a href="https://dribbble.com/shots/3723334-Fitness-App">Dribble</a></p><h3>8. Add a piece of entertainment: news and tips for users</h3><p>News and tips are not a necessary element in your application, but it allows users to find more information within your app not using Internet sources. It widens the user’s horizons and helps him achieve higher results. Plus, this is also a reason to visit your app more often and, consequently, it increases the average time spent in the app and average session length.</p><h3>9. Make sure that peer reviews are conducted by the team</h3><p>Peer reviews are such practices when developers review each other’s code before the QA stage. It may seem unobvious at the first glance, but imagine that each code line has the experience of several developers. Any specialist can make mistakes, and all of them have different levels of expertise — peer development helps to smooth any roughness in the code.</p><p>But not all practices of peer reviews are efficient enough for the final result. These are examples of successful practices which can be implemented in your project:</p><ul><li><em>Reviewing less than 200–400 code lines at one time.</em></li><li><em>Thorough reviewing should take not more than 1.5 hours.</em></li><li><em>Using quantifiable metrics to see the progress.</em></li><li><em>Using checklists, etc.</em></li></ul><h3>The Post-Development Stage</h3><h3>10. Take care of the high-security level</h3><p>People entrust their smartphones with more personal information every year. While it makes our lives more comfortable in some ways (for example, using payment apps), malware never sleeps and hunts our personal data. As a businessman, you should make the final decision about the security level of your product. You become a mediator between your users and outside threats of attackers.</p><p>You can check the needed security level starting with the basics:</p><ul><li><em>Following Secure Coding Guide written by Apple.</em></li><li><em>Custom encryption.</em></li><li><em>Data protection with HTTPS and SSL certificates, etc.</em></li></ul><h3>11. Check the user interactions</h3><p>The work doesn’t end when the user downloads an app. Actually, this is where the real conversation between the product and customer begins. To check if this communication is pleasant for the user, work with the most reliable analytics tools.</p><p>These are instruments you can turn to looking for the relevant data:</p><ul><li><em>Flurry</em></li><li><em>AppSee</em></li><li><em>Countly</em></li><li><em>Localytics</em></li><li><em>Mixpanel</em></li></ul><h3>12. Consider the monetization strategy</h3><p>There are plenty of ways <a href="https://tecsynt.com/blog/research-and-development/how-to-create-an-app-and-make-money">how mobile app owners can make money with their product</a>. As for fitness apps, freemium is the most popular model to get profit, i.e. usually users are offered to open some extra functionality for money. Here are examples of such apps on the market: Strava, MapMyRun, Zombies, Run!, and lots of others.</p><p>You can also offer users some advanced services such as individual workouts or a customized diet plan, depending on the idea of your application.</p><h3>Ready! Steady! Develop!</h3><p>Any mobile application requires a row of preliminary steps to be sure your product will meet the audience’s expectations. People now have an opportunity to compare several similar apps to choose what they really want, so there are no steps you can miss when building any type of the fitness app.</p><p>Each item we’ve described in the checklist needs to be detailed while working out an idea of the new application. We have a great piece of knowledge to share about iOS development, and will gladly give you a free consultation on any aspect of your future fitness app.</p><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*6gfnVvkMRFtjVsWF7vkClA.png" /></figure><h4>This story is published in <a href="https://medium.com/swlh">The Startup</a>, Medium’s largest entrepreneurship publication followed by 301,336+ people.</h4><h4>Subscribe to receive <a href="http://growthsupply.com/the-startup-newsletter/">our top stories here</a>.</h4><figure><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*6gfnVvkMRFtjVsWF7vkClA.png" /></figure><img src="https://medium.com/_/stat?event=post.clientViewed&referrerSource=full_rss&postId=680bbbbaba89" width="1" height="1"><hr><p><a href="https://medium.com/swlh/how-to-make-an-ios-fitness-app-12-tips-checklist-680bbbbaba89">How to Make an iOS Fitness App: 12 Tips Checklist</a> was originally published in <a href="https://medium.com/swlh">The Startup</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>]]></content:encoded>
        </item>
    </channel>
</rss>