Resources
Are you a designer interested in doing open source design or simply seeing what open source can offer you to work on your non-open source projects? Look no further. Here is a collection of great tools, libraries, reading material, and media for you to use, for free (as in cost), while you spread the free (as in freedom) love of open source design!
- Projects - list of open source projects with an attention to design.
- People - list of designers who work heavily on open source projects and tools.
Are you a developer looking for a designer? Consider posting to our jobs board.
Designers are not only designers who finish a concept and »hand it off« to developers who implement it – that won’t happen. The key is continuous dialog with the people who could implement it, small steps, incremental improvements and documenting your designs clearly so it’s understandable why the changes you propose are better than the current state.
Tools
- Use a pen & paper for mockups and prototypes. No hi-fi Photoshop work needed.
- Design discussion on the issue tracker of the project. For example at GitHub – get an account, identify design issues, participate, and open new issues. Establish a »Design« tag on the tracker to group these issues, for example like in the Nextcloud issues.
- If you want to dive into the code (awesome!) just check on the project page how to set up a development environment and get going.
Material
- Creative Commons search
- Wikimedia
- Youtube
- SoundCloud
- Vimeo Music Store has CC and purchasable icons
Images
- Gratisography
- Tinyography
- Flickr
- The Stocks
- FreeImages
- Unsplash
- Pexels
- StockSnap
- FindA.Photo
- Pixabay
- New York Public Library Public Domain Images
Inspiration
Icons
- The Noun Project CC and purchasable icons.
- IcoMoon CC icons and free to use icon-font creation software.
- Pictogramas Open source free icons for personal and commercial purposes.
- ToIcon All icons are licensed under a Creative Commons.
- Inkscape Open Symbols Open source icon sets to use as Inkscape symbols.
- IconMonstr A large collection of glyph icons from a German artist. Free to use without attribution and free to modify.
- FontAwesome The iconic font and CSS toolkit. Free to use. CDN. GitHub.
Fonts
CSS Frameworks
- Bootstrap Fully featured mature HTML, CSS (LESS) & Javascript.
- Foundation Fully featured mature HTML, CSS (Sass) & Javascript.
- BASCSS Lightning-Fast, Modular CSS for Designers.
- Bourbon A simple and lightweight mixin library for Sass.
- Kickoff A lightweight front-end framework for creating scalable, responsive sites.
- Space Base A sass-based responsive css framework.
- Rebar Simple lightweight HTML, CSS (LESS)
General Design Reads
- First Rule of Usability? Don’t Listen to Users by Jakob Nielsen (2001)
- 10 Heuristics for User Interface Design by Jakob Nielsen (1995)
- 19 Principles of User Interface Design by Joshua Porter
- ten principles for good design by Dieter Rams (1970s)
- A Beginner’s Guide to Finding User Needs
- Don't Make Me Think
- The Design of Everyday Things
- Design principles for UI/UX
Open Source and Design Reads
- The Noun Project for icons.
- The League of Movable Type, Open Font Library, Google Web Fonts
- Bootstrap HTML, CSS & Javascript framework
- How Not To Design a Portfolio
- Wordpress themes – but design is not theming.
- Open Design Now book.
- Usability in Free Software thesis.
- How to get designers (or anyone) to work on your open source project recent article on Design Open.
- Bariers Faced by newcomers to open source projects: a systematic review Research Paper.
- An Exploration of Fedora's Online Open Source Development Community Research Paper.
- Designers and women in open source Why designing is difficult for Open Source.
- Designers, Women, and Hostility in Open Source Project Follow up to the above article.
- Barriers for Designers What barriers designers face when contributing to Open Source.
Searching The Creative Commons
Learn to Code
Focused on HTML, CSS, Javascript.) Ideally, to be able to implement your own suggestions. But also to better discuss with developers and be understand why and how certain things work and don’t work.
- WebPlatform web development resources.
- Mozilla Developer Network for great web dev documentation.
- Unheap a tidy repository of jQuery plugins.
- Transitional Interfaces, Coded for good animations.
- Codecademy with interactive tutorials.
- Try Git also with interactive tutorials.
- code.org
- Code School learn even more.
- Egghead to learn the AngularJS framework.
- Tota11y a bookmarklet to check that your website is a11y compliant.
Learn to Design
Learn about design concepts!
- Hack Design Free design lessons by inspirational designers.
- Design Lab Design course with mentorship and projects.
- Voice and Tone Learn about writing good copy.
Other nice stuff
- Libre Graphics magazine print magazine.
- Libre Projects collection of nice open source web apps.
- Libre Graphics World
- Libre Graphics Meeting conference.
- Transifex an open translation platform lots of open source projects use.
- Indiegogo crowdfunding platform, also useful for funding open source projects.
- Beautiful Open Beautiful sites for Open Source projects.
- Design Open Src A list of awesome designers willing to work on Open Src projects, created by @clintonhalpin
- Open Design and Hardware Group. OKFN open design and hardware group.
- PIXLS.US Free/Open Source Photography.