Designer’s Survival Kit for a Hackathon
Ideation & design process
How should I go through the design process?
Specific tools & canvas
- Mindmapping tools: XMind, Coggle, Mindmeister, Mural.ly
- Persona Templates: Xtensio, OrangeBus & a nice guide on how to make your own template
- Empathy map canvas on GameStorming
Icons
- NounProject* for monochrome icons as svg
- Material Design Icon Library for smaller UI icons
- IconFinder for mixed variety of icons
- Font Awesome
- UX Pin
Fonts
- Google Fonts (Jump to the section featuring new/paired typefaces, or check collections for UIs, pairs with examples, selected font families)
- The League of Moveable Type for more open source typefaces
- Mukta by Ek Type for open source Indic typefaces
Colors
Color palette for app design:
- Material Design Palette: Official guidelines and a quick tool to create your own palette
- Adobe Color CC (earlier known as Kuler)
- Colorlovers
Color palette for data visualization:
- Susie Lu’s Viz Palette tool that links to three useful tools:
- ColorBrewer for basic sequential, categorical & diverging color scales (Quick list here)
- Chroma.js when you want to create multi-stop color scales using specific colors
- Colorgorical for generating categorical palettes with n colors
Illustrations
Comics
Photos
- Unsplash
- Flickr (Commercial use allowed)*
- SubtlePatterns
- Profile photos for your UIs like UI Faces, Random User API
UI Inspiration
- MaterialUp, iOSUp
- Pinterest (for Material Design, iOS design & more)
- UI designs on Designspiration
- UI designs on Dribbble
OS based guidelines
- Android: Material design guidelines and more resources
- iOS: Design principles & a detailed unoffical guide/cheatsheet
Front-end frameworks
- Bootstrap (tons of free themes available)
- Zurb Foundation
- HTML5 Boilerplate
- Grid systems like Skeleton, Lemonade
More resources
License
When using any design assets (Photos, Fonts, Icons etc.) from these resources, please make sure they are either Royalty Free or provide attribution as per the Creative Commons license. Copyrighted content should not be used without prior permission.
This list is under Unlicense/Public Domain license — feel free to share/reuse for your own event/hackathon.
How to contribute
This collection of design resources was first built for the participants of the Heroes vs Hackers Hackathon to be held in BSE Mumbai on 28th & 29th November, 2015.
Updated sporadically by @rasagy, PRs welcome! Or feel free to tweet to @rasagy to suggest a resource.