
{"id":5162,"date":"2021-06-04T12:00:00","date_gmt":"2021-06-04T10:00:00","guid":{"rendered":"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/uncategorized\/ux-resources-for-beginners\/"},"modified":"2021-08-05T11:38:03","modified_gmt":"2021-08-05T09:38:03","slug":"ux-resources-for-beginners","status":"publish","type":"post","link":"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/ux-resources-for-beginners\/","title":{"rendered":"UX Design Resources For Beginners: The Ultimate Survival Toolkit"},"content":{"rendered":"<p>Learning by Googling isn\u2019t always the most efficient way to get the lay of the land in a new field. How do you know what the best UX design resources are? As a UX teacher, I have a list of resources to share with each of my students at appropriate stages in their design projects. If you\u2019re looking to learn more about what UX design is and how to do it, here&#8217;s my survival guide for every (new) UX designer.<\/p>\n<p>I\u2019ve divided it into resources that are great for when you\u2019re learning UX best practices, and those that will help when doing UX activities. Like many things in life, though, these two categories form a Venn diagram more than a table.<\/p>\n<p>In this guide, you\u2019ll find:<\/p>\n<ol>\n<li><a href=\"#learning-ux\">High-quality resources for reading up on UX<\/a><\/li>\n<li><a href=\"#learning-and-doing\">Useful materials for mastering UX best practices<\/a><\/li>\n<li><a href=\"#doing-ux\">Hands-on tools to help you with your first design projects<\/a><\/li>\n<\/ol>\n<p>And if you&#8217;re brand new to UX design,\u00a0take a <a class=\"ProsemirrorEditor-link\" href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/short-courses\/become-a-ux-designer\/\">free UX design micro course<\/a> to learn the basics.<\/p>\n<p>Now, without further ado: Your UX design survival kit!<\/p>\n<h2 id=\"learning-ux\">1. Learning UX<\/h2>\n<p>When you\u2019re just starting out in UX, it\u2019s important to immerse yourself in as much theory as possible. Master the <a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/get-your-first-taste-of-ux-design-with-ux-fundamentals\/\">fundamentals of UX<\/a>. Here are some high-quality resources for regular reading that will help you to learn all about what UX design is and how to do it.<\/p>\n<p><img decoding=\"async\" title=\"A Venn diagram depicting all the tools you need for learning and practicing UX design\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/venn-learning3x.png\" alt=\"A Venn diagram depicting all the tools you need for learning and practicing UX design\" \/><\/p>\n<h3 id=\"what-is-how-to\">What is\u2026 ? How to\u2026?<\/h3>\n<h5 id=\"brusabilitygovhttpswwwusabilitygov-targetblank\"><a href=\"https:\/\/www.usability.gov\" target=\"_blank\" rel=\"noopener\"><strong>Usability.gov<\/strong><\/a><\/h5>\n<p>.gov sites tend to be some of the most reliable, and Usability.gov is no exception. It\u2019s a comprehensive site with really good explanatory articles on what basic UX concepts are and how to apply them. They also give really excellent instructions on how to conduct various research methods. Even better, they have lots of <a href=\"https:\/\/www.usability.gov\/how-to-and-tools\/resources\/templates.html\" target=\"_blank\" rel=\"noopener\">downloadable templates<\/a> for these research methods, like recruiting emails, consent forms, and usability testing scripts.<\/p>\n<p><strong><em>Use Usability.gov when\u2026<\/em><\/strong>you have to conduct a card sort or a usability test and don\u2019t really know where to start. It\u2019s also just a great source of regular reading to get a foundational understanding of basic UX concepts.<\/p>\n<h3 id=\"blogs-and-videos\"><strong>Blogs and Videos<\/strong><\/h3>\n<p><a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/best-ux-design-blogs\/\">UX blogs<\/a> and YouTube channels can offer lots of great information, but like anything on the internet, they can really vary in quality. Make sure you approach this type of content with a more critical eye. For the best information, read blogs by industry leaders like <a href=\"https:\/\/www.lukew.com\" target=\"_blank\" rel=\"noopener\">Luke W<\/a> (Google) or credible companies involved in UX. How-to guides are great for exploring a specific method from start to finish. Try these for starters: <a href=\"\/en\/blog\/ux-design\/how-to-create-your-first-wireframe\/\">How to Create Your First Wireframe<\/a> and <a href=\"\/en\/blog\/ux-design\/how-to-conduct-usability-testing-a-step-by-step-guide\/\">How to Conduct Usability Testing<\/a>.<\/p>\n<p><strong><em>Use blogs and videos when\u2026 <\/em><\/strong>you\u2019re looking to get other designers\u2019 perspectives or learn about a specific piece of the field.<\/p>\n<h3 id=\"published-usability-research\">Published Usability Research<\/h3>\n<p>Learning best practices for how to design usable products takes time. However, a couple of insanely reputable Denmark-based research firms publish their research on almost every UX subject imaginable. When I\u2019m wireframing, these two sources are my very places to turn for information.<\/p>\n<h5 id=\"nielsen-norman-grouphttpswwwnngroupcom-targetblank\"><a href=\"https:\/\/www.nngroup.com\" target=\"_blank\" rel=\"noopener\">Nielsen Norman Group<\/a><\/h5>\n<p>Don Norman is often credited with founding the field of UX, and Jakob Nielsen\u2019s <a href=\"https:\/\/www.nngroup.com\/articles\/ten-usability-heuristics\/\" target=\"_blank\" rel=\"noopener\">Ten Usability Heuristics<\/a> could be called the Ten Commandments of UX. Unsurprisingly, their Nielsen Norman Group rocks (AKA is a leader in the field of usability research). NNGroup conducts tons of usability tests on all different types of products, and publishes free, super readable articles summarizing their findings.<\/p>\n<p><strong><em>Use Nielsen-Norman Group when\u2026<\/em><\/strong>you want to learn more about how users think about or interact with any part of digital products. Also, whenever you start wireframing a new feature.<\/p>\n<h5 id=\"baymard-institutehttpsbaymardcom-targetblank\"><a href=\"https:\/\/baymard.com\" target=\"_blank\" rel=\"noopener\">Baymard Institute<\/a><\/h5>\n<p>Baymard Institute does similarly amazing usability research but specializes in e-commerce usability. On basically any subject related to searching, shopping, or buying things online, Baymard has excellent research articles that explain best practices in a really readable way.<\/p>\n<p>One of their best is their benchmark studies. These articles evaluate how the top 50 or 60 e-commerce websites succeed or fail in meeting a given best practice. I used their <a href=\"https:\/\/baymard.com\/product-page\/benchmark\/page-designs\/product-page\" target=\"_blank\" rel=\"noopener\">Product Page Benchmark Study<\/a> just last week!<\/p>\n<p><strong><em>Use Baymard Institute when\u2026 <\/em><\/strong>you want to learn more about how users think about or interact with any part of e-commerce digital products. And, whenever you start wireframing a new feature.<\/p>\n<h2 id=\"learning-and-doing\">2. Learning and Doing<\/h2>\n<p>Now that you\u2019ve read up on the key processes and methodologies of the field, it\u2019s time to put them into practice. Here are my go-to resources for learning and following best practices and for coming up with ideas when you sit down to start working.<\/p>\n<p><img decoding=\"async\" title=\"A Venn diagram depicting all the tools you need for learning and practicing UX design\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/venn-both3x.png\" alt=\"A Venn diagram depicting all the tools you need for learning and practicing UX design\" \/><\/p>\n<h3 id=\"pattern-libraries\">Pattern Libraries<\/h3>\n<p>A pattern library is a collection of solutions to a particular design problem. Pattern Libraries are a great way to get ideas when designing a feature or interaction. You might look at a pattern library to see examples of login or checkout pages, for instance.<\/p>\n<h4 id=\"ui-patternshttpui-patternscom-targetblank\"><a href=\"http:\/\/ui-patterns.com\" target=\"_blank\" rel=\"noopener\"><strong>UI-Patterns<\/strong><\/a><\/h4>\n<p>UI Patterns is a really well-organized site for design patterns. It focuses on interactive parts of interfaces \u2014 forms, menus, search bars, etc. \u2014 which makes it so helpful for <a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/what-are-ux-ui-and-interaction-design-and-which-should-you-learn\/\">interaction designers<\/a>. Each feature has a short, curated article that briefly explains the user problem when it occurs, and examples of design solutions.<\/p>\n<h4 id=\"pattern-taphttpspatterntapcompatterntap-targetblank\"><a href=\"https:\/\/patternpad.com\/\" target=\"_blank\" rel=\"noopener\"><strong>Pattern Pad<\/strong><\/a><\/h4>\n<p>Pattern Pad makes it easy to find the exact patterns you want. In addition to the existing templates, you can customize designs further with filters including color, font, density, and space.<\/p>\n<h3 id=\"design-languages\">Design Languages<\/h3>\n<p>Design languages are guidelines that ensure consistency and quality across a certain product or digital ecosystem (like iOS or Android mobile products). Design languages lay out very specific best practices you can\u2014or, in some cases, must\u2014follow if you\u2019re designing for specific devices. Familiarity with the two languages below is a must for mobile designers.<\/p>\n<h4 id=\"ios-human-interface-guidelines-highttpsdeveloperapplecomdesignhuman-interface-guidelinesiosoverviewthemes-targetblank\"><a href=\"https:\/\/developer.apple.com\/design\/human-interface-guidelines\/designing-for-ios\" target=\"_blank\" rel=\"noopener\"><strong>iOS Human Interface Guidelines (HIG)<\/strong><\/a><\/h4>\n<p>The HIG tells you everything, from how to design a search bar or navigation bar to font and image specs. It\u2019s the definitive resource for iOS apps. The section on user interactions is especially helpful for UX designers.<\/p>\n<p><strong><em>Use iOS Human Interface Guidelines when<\/em><\/strong><strong><em>\u2026 <\/em><\/strong>designing for iPhones, iPads, Apple Watches, or other Apple mobile devices. Its recommendations are a good resource for mobile websites, too.<\/p>\n<h4 id=\"material-design-guidelineshttpsmaterialiodesign-targetblank\"><a href=\"https:\/\/material.io\/design\/\" target=\"_blank\" rel=\"noopener\"><strong>Material Design Guidelines<\/strong><\/a><\/h4>\n<p>Google\u2019s Material Design Guidelines do for Android devices what HIG does for iOS, though it also offers valuable guidelines for websites too. It includes tons of suggested practices for interactions and visual design, and it even has some pre-designed themes you can easily apply to your own project.<\/p>\n<p><strong><em>Use Material Design Guidelines when<\/em><\/strong><strong><em>\u2026 <\/em><\/strong>designing for Android mobile apps or Google\u2019s operating system. Or when looking for best practices when designing a website.<\/p>\n<h2 id=\"doing-ux\">3. Doing UX<\/h2>\n<p>Once you get down to business, you\u2019ll need various tools for creating your designs from start to finish. Here are some useful resources for when you\u2019re ready to get hands-on.<\/p>\n<p><img decoding=\"async\" title=\"A Venn diagram depicting all the tools you need for learning and practicing UX design\" src=\"\/en\/wp-content\/uploads\/old-blog-uploads\/venn-doing3x.png\" alt=\"A Venn diagram depicting all the tools you need for learning and practicing UX design\" \/><\/p>\n<h3 id=\"templates\">Templates<\/h3>\n<p>Why start from scratch when you don\u2019t have to? Templates are a great way to put the technical stuff aside for a minute so you can focus on getting your ideas down on digital paper. As you progress in your design career, you\u2019ll probably create your own templates to reuse, but especially when getting started, these templates can be a lifesaver!<\/p>\n<h4 id=\"wireframing-templates\"><strong>Wireframing Templates<\/strong><\/h4>\n<p>If your wireframing tool of choice is Sketch, you just might be me. More likely, though, you\u2019re somebody else, so you may not know that <a href=\"https:\/\/www.sketchappsources.com\" target=\"_blank\" rel=\"noopener\">SketchAppSources<\/a> is your go-to for UI Kits, wireframe templates, icon sets, and more. If you like free things, you might be wireframing with <a href=\"https:\/\/www.figma.com\/\" target=\"_blank\" rel=\"noopener\">Figma<\/a>, a free wireframing and prototyping tool.<\/p>\n<h4 id=\"templates-for-other-stuff\"><strong>Templates for Other Stuff<\/strong><\/h4>\n<p>While wireframes get top billing in the movie of a UX designer\u2019s life, there\u2019s almost always a cast of other characters. <a href=\"https:\/\/xtensio.com\/templates\/\" target=\"_blank\" rel=\"noopener\">Xtensio<\/a> has a ton of templates for various deliverables, my favorite of which is their <a href=\"https:\/\/library.xtensio.com\/user-persona-template-and-examples\" target=\"_blank\" rel=\"noopener\">persona template<\/a>. It\u2019s really attractive and easy to use, so you can go from 0 to <a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/blog\/ux-design\/user-persona-downloadable-template-pictures\/\">user persona<\/a> in about 3.5 seconds (x 10).<\/p>\n<p>UXPressia has beautiful templates for user journey maps, personas, and impact maps, too. You can get started with a free account with one active project at a time. You can always use these as inspiration for your own templates too!<\/p>\n<h3 id=\"icons\">Icons<\/h3>\n<p>Who wants to waste their time designing icons when they could be designing wireframes? Well, one answer to that is UI designers. But if your answer to that question was \u201cnot me,\u201d check out the icon libraries below and then download some icons for your own projects!<\/p>\n<h4 id=\"material-design-iconshttpsmaterialdesigniconscom-targetblank\"><a href=\"https:\/\/materialdesignicons.com\" target=\"_blank\" rel=\"noopener\"><strong>Material Design Icons<\/strong><\/a><\/h4>\n<p>A large set of icons created by Google and authorized designers, free to download in a variety of file formats.<\/p>\n<h4 id=\"the-noun-projecthttpsthenounprojectcom-targetblank\"><a href=\"https:\/\/thenounproject.com\" target=\"_blank\" rel=\"noopener\"><strong>The Noun Project<\/strong><\/a><\/h4>\n<p>A collection of wide-ranging community-contributed icons. If you can\u2019t find the icon you need on Material Design Icons, come here. Many of them are free with attribution, or you can pay to get royalty-free icons.<\/p>\n<p>These are just a handful of resources that can help you in your work. Read more in this <a href=\"\/en\/blog\/ux-design\/essential-tools-for-ux-designers-a-beginners-guide\/\">beginner\u2019s guide to essential UX design tools<\/a>.<\/p>\n<h2 id=\"ux-resources-for-beginners-the-takeaway\">UX Resources for Beginners: The takeaway<\/h2>\n<p>As you get more experience in the field, you\u2019ll develop your own workflow and find the resources that work best for you. Until then, let this survival kit be your copilot through the journey of\u2026 well, use it to get high-quality UX answers when you need them!<\/p>\n<p>Want something more hands-on? Check our <a href=\"https:\/\/careerfoundry.inbearbeitung.de\/en\/courses\/ux-fundamentals\/\" target=\"_blank\" rel=\"noopener\">1 month UX Fundamentals<\/a> course to learn the basics under the guidance of a tutor and mentor in the field.<\/p>\n<p>For the audio-visual consumers among you, I recommend watching this video round-up of six awesome (and free!) design resources presented by expert designer Dee Scarano:<\/p>\n<style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }<\/style>\n<div class=\"embed-container\"><iframe src=\"https:\/\/www.youtube.com\/embed\/\/8H-iRwKF-CM\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Learning by Googling isn&#8217;t always the most efficient way to get the lay of the land in a new field. UX designer Jonny Grass shares his top resources for new UX designers.<\/p>\n","protected":false},"author":25,"featured_media":692,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_lmt_disableupdate":"yes","_lmt_disable":"","footnotes":""},"categories":[2],"tags":[],"class_list":["post-5162","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ux-design"],"acf":{"homepage_category_featured":false},"modified_by":"John Sch\u00e4rges","_links":{"self":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/posts\/5162","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/users\/25"}],"replies":[{"embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/comments?post=5162"}],"version-history":[{"count":5,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/posts\/5162\/revisions"}],"predecessor-version":[{"id":26574,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/posts\/5162\/revisions\/26574"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/media\/692"}],"wp:attachment":[{"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/media?parent=5162"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/categories?post=5162"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/careerfoundry.inbearbeitung.de\/en\/wp-json\/wp\/v2\/tags?post=5162"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}