UX & UI Design
Intro to UX Design
What is User Experience Design? An Overview
But regardless of how much has changed in the production process, a websiteâs success still hinges on just one thing: how users perceive it. âDoes this website give me value? Is it easy to use? Is it pleasant to use?â These are the questions that run through the minds of visitors as they interact with our products, and they form the basis of their decisions on whether to become regular users.
User experience design is all about striving to make them answer âYesâ to all of those questions. This guide aims to familiarize you with the professional discipline of UX design in the context of Web-based systems such as websites and applications.
http://www.smashingmagazine.com/2010/10/what-is-user-experience-design-overview-tools-and-resources/
A beginnerâs guide to understanding UX design
What is UX Design?
UX Design can be defined in several different ways, but in the simplest form it understanding what people do and then designing a way to make it better. The goal is to first clearly define the user and meet their measure of success (in concert with the organizational or client goals).
http://thenextweb.com/dd/2015/08/12/a-beginners-guide-to-understanding-ux-design/
What do UX Designers actually do?
I still remember the first time I came across the term âUser Experience Designerâ. It was years ago, embedded in the email signature of a friend of mineâsomeone whose job I never quite understood. So I asked him.
His answer fundamentally changed how I designed websites from that day forward. Not because of what he actually said (he mumbled something about usability and research) but because of the ongoing discussion that ensued. That discussion prompted me to dig deeper into the world of UX, re-evaluate my processes, and dramatically shape my career
http://www.sitepoint.com/ux-designer-actually/
Blogs & Resources
The Nielsen Norman  Group – Evidence-Based User Experience Research, Training, and Consulting
NN/g conducts groundbreaking research, evaluates user interfaces, and reports real findings â not just what’s popular or expected. With our approach, NN/g will help you create better user experiences and improve the bottom line for your business.
https://www.nngroup.com/articles/
UX Mastery
Weâre an online resource for aspiring user experience designers.
http://uxmastery.com/
UXMax
Digital Advent Calendar that runs through the month of December
http://uxmas.com/
Smashing Magazine: UX Design
Curated Smashing Magazine Blog
http://www.smashingmagazine.com/category/uxdesign/
Smashing Magazine UI Design
Curated Smashing Magazine Blog
http://www.smashingmagazine.com/tag/ui/
UX Matters
Insights and Inspiration for the UX Community
http://www.uxmatters.com/
UX Mag
Blog for UX Mag
https://uxmag.com/
UX Cards
http://nform.com/cards/
Site of nform.com, a services company that specializes in UX/UI design. Explains UX research Methods.
Hack Design
Instruction on Design, UX, UI, Color, etc.
https://hackdesign.org/lessons
The Hipper Element
USING, ABUSING, & DESIGNING HUMAN NATURE.
AUTHOR â JOEL MARSH: EXPERIENCE ARCHITECT
http://thehipperelement.com/
Adobe Creative Cloud â UX/UI Design
https://blogs.adobe.com/creativecloud/category/xd/
UX Design Workflows
UX Designers share their workflows
What is your User Experience practice workflow? What standardized activities and processes work and are valuable to improve? What tools and deliverables do you prefer?
https://www.quora.com/What-is-your-User-Experience-practice-workflow-What-standardized-activities-and-processes-work-and-are-valuable-to-improve-What-tools-and-deliverables-do-you-prefer
The Most Overlooked Aspect Of UX Design Could Be The Most Important
An empty state is what the user sees when there is no data to display on the screen. This could be because:
- The user has only just signed up.
- The user has cleared the data themselves.
- Thereâs been an error.
Weâll quickly go through some examples of these three different kinds before taking a deeper look into how empty states can help increase retention and ensure users get the most out of your app.
https://blog.marvelapp.com/empty-state-most-overlooked-aspect-of-ux-design/?utm_source=Marvel+Email+Updates&utm_campaign=22129f044d-Weekly_roundup_31_08_16&utm_medium=email&utm_term=0_f0c2e2c157-22129f044d-427377173
UX Design Process | Techniques
UX MasteryâUX Design Process Breakdown
http://uxmastery.com/resources/process/
UX Mastery Catalog of UX Design Techniques
http://uxmastery.com/resources/techniques
How to Conduct User Interviews
User interviews can be a great way to extract information from users for user experience understanding, usability understanding and ideation. They are cheap and easy to conduct and can be readily conducted by anyone who can ask questions and record the answers.
https://www.interaction-design.org/literature/article/how-to-conduct-user-interviews?utm_source=facebook&utm_medium=sm&utm_content=how_to_conduct_an_effective_user_interview&utm_campaign=post
LEAN/AGILE UX DESIGN
Lean UX vs. Agile UX â is there a difference?
User Experience Design world is a well established kingdom of acronyms and buzz words. UX, IxD, IA, UCD, CX, agile UX, lean UX, guerrilla research, strategic UX, Emotional design⊠weâre swimming in the sea of strange words risking catastrophe of miscommunication of our own field.
https://studio.uxpin.com/blog/lean-ux-vs-agile-ux-is-there-a-difference/
Doing UX in an Agile World: Case Study Findings
Summary: Agile teams are more proficient in executing the development process, but the compressed timescale forces some to abandon user research and degrade the resulting user experience.
https://www.nngroup.com/articles/doing-ux-agile-world/
UX & UI Design Software
UX Pin
Never design alone.
Design, prototype and collaborate with your entire team in one platform.
http://www.uxpin.com/
InVision App
DESIGN BETTER. FASTER. TOGETHER.
The world’s leading prototyping, collaboration & workflow platform
https://www.invisionapp.com/
Marvel
Turn sketches, mockups and designs into web, iPhone, iOS, Android and Apple Watch app prototypes.
https://marvelapp.com/
Balsamiq Mockup
Getting your ideas out should be effortless. We sweat the details so the app gets out of your way, instead of forcing you to learn it. You won’t see many dialog windows interrupting your flow, and you won’t have to twiddle with options all the time.
https://balsamiq.com/products/mockups/
Mockups
Moqups makes it easy to quickly mock your website or mobile app, add interactivity and share with your collaborators
https://app.moqups.com
Personal Stories
Kieran Black: My App Design Workflow
First of all, this is somewhat of a rebound of what Marc Edwards from Bjango has written up for his app design workflow. This article will be a little bit more broad on UI design covering both web design and native app design. By the way, this is just my opinion on how to design for UIs, there are probably better ways to do all of these things. If you do have a better way, tell me in the comments below, Iâm always interested in refining my workflow.
https://medium.com/@kieranpblack/my-app-design-workflow-39df2f3d2410
Where Did The Target Prescription Bottles Everyone Loves So Much Come From, Anyway?
We didnât realize how much affection consumers had for Targetâs ClearRX prescription bottling system until the bottles went away after CVS purchased Targetâs pharmacies. Maybe customers themselves didnât realize how attached they were to those bottles until they consigned to memory, but with the CVS takeover of Targetâs pharmacy business, theyâre now gone. Why are people so attached to a prescription bottle, though?
https://consumerist.com/2016/08/24/where-did-the-target-prescription-bottles-everyone-loves-so-much-come-from-anyway/
What Iâve Learned as a UX Interviewer
Sitting on the other side of the table during a UX interview is a very different experience. I donât see a lot written from the personal perspective of the UX interviewer. There are generalized guides and how-toâs, but no actual real-life accounts.
http://www.helloerik.com/what-ive-learned-as-a-ux-interviewer
Information Architecture
Prezi on Understanding Information Architecture
https://prezi.com/aafmvya6bk7t/understanding-information-architecture/
Prototyping
What a Prototype Is (and Is Not)
https://uxmag.com/articles/what-a-prototype-is-and-is-not
Wireframes are dead, long live rapid prototyping
http://www.uxforthemasses.com/rapid-prototyping/
Research Methods
INC MagazineâConducting a Competitive Analysis
http://www.inc.com/guides/2010/05/conducting-competitive-research.html
Creating a Solid UX Competitive Analysis
http://danforth.co/pages/2014/03/01/conducting-a-solid-ux-competitive-analysis/
User TestingâHow Many Users Should I Test
Summary: The answer is 5, except when it’s not. Most arguments for using more test participants are wrong, but some tests should be bigger and some smaller.
https://www.nngroup.com/articles/how-many-test-users/
Mental Modeling
A mental model diagram is a fishbone or horizon diagram where the top towers represent individuals’ motivations, emotions, and stories related to their experience in achieving a particular goal, regardless of the tools they use.
Mental Models
by JAKOB NIELSEN
Summary: What users believe they know about a UI strongly impacts how they use it. Mismatched mental models are common, especially with designs that try something new.
https://www.nngroup.com/articles/mental-models/
The Secret to Designing an Intuitive UX : Match the Mental Model to the Conceptual Model
UXMAG.COM
Summary: Psychological concepts underlying good user experience and usability.
https://uxmag.com/articles/the-secret-to-designing-an-intuitive-user-experience
Half of UX is 90% Mental
abovethefolddesign.com
Summary: To put it simply, a mental model is a personâs intuition of how something works based on past experiences, knowledge, or common sense.
http://blog.abovethefolddesign.com/2011/10/11/half-of-ux-is-90-mental/
Mental Model Diagrams (Cartoon)
By Indi Young and Brad Colbow
Summary: We tend to carefully create our HTML and CSS, and meticulously place every pixel to our designs. We plan exactly where our content should be placed on a particular site. Among many other decisions we need to make, we always keep in mind to craft a great experience for all our users. But how do we know what our users really want?
https://www.smashingmagazine.com/2012/04/mental-model-diagrams-cartoon/
DESIGNING FEATURES USING JOB STORIES
Summary: Personas and User Stories made sense when customers and product teams were far from each other. Thatâs no longer the case.
https://blog.intercom.io/using-job-stories-design-features-ui-ux/
Journey or Experience Maps
The Anatomy of an Experience Map
Experience maps have become more prominent over the past few years, largely because companies are realizing the interconnectedness of the cross-channel experience. Itâs becoming increasingly useful to gain insight in order to orchestrate service touchpoints over time and space.
http://adaptivepath.org/ideas/the-anatomy-of-an-experience-map/
Personas
Introduction to User Personas
From all over the techniques and tools related to design process and User experience, only personas appears as a consistent common denominator, even in methods against the use of extensive âdeliverablesâ as Lean UX. Most of the point of view agree in that the secret of a great user experiences strategy lies on this tool, even so the building process varies significantly.
http://www.ux-lady.com/introduction-to-user-personas/
DIY User Personas
Probably you already know what a persona is âif donât check this -, and probably you, like me,build your first persona using some of the thousands personas layout you can find in the internet. But as has happened to me youâve probably also discovered this is not easy workâŠ
http://www.ux-lady.com/diy-user-personas/
The Easy Way to Create User Personas: Tips, Tricks and Two Free Templates
Today Iâm going to show you how to create better user personas. And by better, what I mean is a true understanding of a user thatâs informed by the messy realities of what itâs like to be human. There are plenty of prescriptions for persona creation, but theyâre all essentially the same: laundry lists that suggest itâs possible to understand a personâs motivation â and create an accurate, useful user persona â simply by checking boxes and asking questions related to behavior.
http://www.givegoodux.com/creating-better-user-personas-tips-templates/
From Personas to User Stories
User stories are a powerful technique to capture the product functionality from the perspective of a user or customer. But how do we discover the right stories? When should they be written and how detailed should they be? Read this post to find out my answers to these questions.
http://www.romanpichler.com/blog/personas-epics-user-stories/
Scenarios
A step by step guide to scenario mapping
Scenario mapping is a really quick, easy and dare I say it even fun way to collaboratively create, discuss and communicate user scenarios. Scenario mapping will help you to think about your users, to think about their tasks and most importantly to think about the sort of user experience you want to provide.
http://www.uxforthemasses.com/scenario-mapping/
Sketch and Prototyping Templates
Ready to print device templates for UI & UX designers.
Inspirational and Useful Resources for App Designers
A great collection of templates and resources that will facilitate the work of user interface designers, about smartphones, tablets and Web apps.
http://www.awwwards.com/inspirational-and-useful-resources-for-app-designers.html#tag6
Animation Techniques
CSS 3 & Javascript Animations
http://justinaguilar.com/animations/index.html#
What is a pitch deck?
A pitch deck is usually a 10-20 slide presentation designed to give a short summary of your company, your business plan and your startup vision. Pitch decks also serve very different purposes, from trying to get a meeting with a new investor, to presenting in front of a stage, and each one of them should follow a different structure.
UX Testing
Maximizer CRM
Customer Relationship Management Service
We donât just build CRM systems â we provide companies with a competitive advantage. With over 1.6 million licenses shipped to more than 120,000 businesses across all industries, Maximizer is helping companies just like yours grow profitably. We make it easy to maximize lead generation and manage pipelines to shorten sales cycles, close more deals and increase revenue, all while delivering exceptional customer service.
Creating UX Portfolios
10 Steps To A Perfect UX Portfolio
Design portfolios have long been used by graphic designers and photographers to display the results of their work. But what about UX portfolios? Do UXers need them?
http://uxmastery.com/10-steps-to-a-perfect-ux-portfolio/
9 tips for creating your UX portfolio
Your UX portfolio is proof that you’re worth hiring. Here’s how to make it the best it can be.
http://www.creativebloq.com/web-design/pro-tips-creating-your-ux-portfolio-71515750
UI DESIGN
User Interface Design Guidelines: 10 Rules of Thumb
Jakob Nielsen, a renowned web usability consultant and partner in the Nielsen Norman Group, and Rolf Molich, another prominent usability expert, established a list of ten user interface design guidelines in the 1990s. Note that there is considerable overlap between Nielsen and Molich’s heuristics and Ben Shneidermanâs ‘eight golden rules’. These 10 rules of thumb further iterate upon Shneidermanâs eight golden rules 4 years after Shneidermanâs initial publication.
Learn UI design by Copying
Throughout most of our academic careers, weâve been taught that copying is a bad thing. Getting caught copying an authorâs work is considered plagiarism. Copying someone else during an exam can lead to expulsion. So itâs not a surprise that we have negative associations with copying, even to this day.
But what about copying as a way to learn?
http://www.uxbeginner.com/learn-ui-design-by-copying/
The Eight Golden Rules of Interface Design
I have often been asked to distill the vast corpus of user interface design into a few key principles. While I was reluctant to do this, it turned out to be a good exercise to write âGolden Rules,â that are applicable in most interactive systems. These principles, derived from experience and refined over three decades, require validation and tuning for specific design domains. No list such as this can be complete, but even the original list from 1985, has been well received as a useful guide to students and designers. Jakob Nielsen, Jeff Johnson, and others have expanded these rules and included their variations, which enriches the discussion. Each edition of the book produces some changes.
https://www.cs.umd.edu/users/ben/goldenrules.html
10 User Interface Design Fundamentals
âStaying out of the wayâ means not distracting your users. Rather, good UIs let your users complete goals. The result? A reduction in training and support costs, and happier, satisfied and highly engaged users.
http://blog.teamtreehouse.com/10-user-interface-design-fundamentals
Effective Visual Communication for Graphical User Interfaces
The use of typography, symbols, color, and other static and dynamic graphics are used to convey facts, concepts and emotions. This makes up an information-oriented, systematic graphic design which helps people understand complex information. Successful visual communication through information-oriented, systematic graphic design relies on some key principles of graphic design.
http://web.cs.wpi.edu/~matt/courses/cs563/talks/smartin/int_design.html
Using Light, Color and Contrast Effectively in UI Design
User interface (UI) design is both an art and a science. Artistic talent comes in handy when coming up with an attractive style and aesthetic, but at the core of UI design lies logic and method.
http://usabilitypost.com/2008/08/14/using-light-color-and-contrast-effectively-in-ui-design/
Creating Style Tiles
Style Tiles are a design deliverable consisting of fonts, colors and interface elements that communicate the essence of a visual brand for the web.
http://styletil.es/
UI Design by Platform
IOS Human Design Principles
https://developer.apple.com/ios/human-interface-guidelines/overview/design-principles/
Google Material Design
https://material.io/
Google Design
https://design.google.com/
Marketing Research
CUSTOMER DEMOGRAPHICS â AGE DEMOGRAPHICS FOR ADVERTISING
Customer demographics are about how old your customers are. It may surprise you to know HOW much age demographics for advertising affects your marketing efforts in this always on world.
http://marketingartfully.com/2012/12/13/customer-demographics-age-demographics-for-advertising/
Creating Surveys
Better User Research Through Surveys
Surveys are increasingly becoming a more accepted tool for UX practitioners. Creating a great survey is like designing a great user experienceâthey are a waste of time and money if the audience, or user, is not at the centre of the process. Designing for your user leads to the gathering of more useful and reliable information.
http://uxmastery.com/better-user-research-through-surveys/
HOW TO QUICKLY CREATE A POWERFUL SURVEY
Surveys are great for quickly collecting large amounts of data about your users. At Envato, our design team creates surveys so we can gain valuable insight about the way people use our product.
http://blog.invisionapp.com/how-to-create-a-survey/
15 useful user feedback questions for online surveys
Online surveys are a quick and incredibly useful tool for gathering all sorts of user feedback. In next to no time you can whip something up using one of the many online survey tools out there and start gathering feedback from real users. Often implementing the survey is the easy bit, itâs designing the thing thatâs the tricky part as you wonât get the feedback youâre after if you donât ask the right questions. In this article I outline 15 useful user feedback questions for online surveys for you to pick and choose from
http://www.uxforthemasses.com/online-survey-questions/
Resumes & Jobs
Tips for Writing a CV for a UX Job Application
Itâs not really fair that before we can show an interviewer how great we are for their position â we have to land that interview in the first place. A good CV can make or break your career prospects; you cannot get a great job without getting an interview. Sadly, in nearly all professions including UX many CVs are simply not fit-for-purpose.
https://www.interaction-design.org/literature/article/tips-for-writing-a-cv-for-a-ux-job-application?
