Guide: Design Essentials in Software Development
About this Guide
I’m a developer and I’ve been tutoring new coders for years. Something that a lot of beginner developers and people making projects trip up on is that they spent so much time learning coding but they didn’t learn the design principles that can bring their work to a more professional level. That’s why myself and some others wrote this guide, covering some key design concepts, so you’ll make better, more beautiful user-centric web products. Wanna know more about these guides (there are others), me, and why we made them? See here.
Design Essentials
The people who made the first version of this guide aren’t designers, so we just cobbled together a reading list based on what we thought developers should know about design and what beginner designers should know too. If you’re a designer and want to help flesh all of this out, please chip in! Just reply with feedback and additions below or let us know if you want to write your own.
What is UI? https://youtu.be/Z-BO6IYTgJg
What is UX? https://youtu.be/OR0r_L2ztDI
UI/UX Principles You’ll Need to know
UI: https://theblog.adobe.com/4-golden-rules-ui-design
UX: https://theblog.adobe.com/15-rules-every-ux-designer-know/
Choosing a Design Tool - https://medium.com/ux-power-tools/a-handy-guide-to-picking-the-right-design-tool-1825dda437a4
Intro to user-centered design - https://www.codecademy.com/articles/ui-design-intro-to-ucd
Understanding Color & Typography, two quick articles: https://www.codecademy.com/articles/f1-u6a2-design-color and https://www.codecademy.com/articles/f1-u6a1-typography
Agile design - https://www.atlassian.com/agile/design
Wireframes and Information Architecture - what they are and how to make one.
Branding - https://medium.com/@tubikstudio/6-creative-stages-of-branding-design-step-by-step-guide-be557fd329fd
2019 UI and UX Design Trends to Know - https://uxplanet.org/2019-ui-and-ux-design-trends-92dfa8323225
What makes a website visually appealing? https://enablewebdesign.com/makes-website-visually-appealing/
What is a Website Prototype and Why Do You Need One? https://www.hotgloo.com/website-prototype
How to make a mockup: https://www.cleveroad.com/blog/step-by-step-tutorial-how-to-create-a-website-mockup-avoiding-common-mistakes-and-pitfalls
How to Prototype: https://usersnap.com/blog/website-prototype/
How to Design Forms the Right Way - https://uxdesign.cc/design-better-forms-96fadca0f49c
How to Design a User Interface https://medium.com/sketch-app-sources/design-cheatsheet-274384775da9
What is the Ideal Design Workflow? https://blog.prototypr.io/the-ideal-design-workflow-2c200b8e337d
Essential Design Tools - https://blog.producthunt.com/0-design-tools-for-your-startup-d4240fbb726f
Design as part of Agile development - https://uxstudioteam.com/ux-blog/agile-design-process/
Not The End
Please reply to this thread with your own resources, advice, and feedback! We made this post a wiki so it can be updated and maintained by the community just as we combined to make them in the first place, we’re just starting them off. For this guide in particular, we’d love help from designers or people familiar in design to flesh this out! See our other guides here.