📰 = Guide
🛠 = Tool
✨ = Inspiration
✅ = Checkliste
💾 = Ressource
Sehr kompakter Guide, mit dem man aber sehr weit kommt. Deckt ab, wie ich zu meinen Hauptfarben und den passenden Grautönen komme.
Kostenloses Colorwheel von Adobe, das im Browser läuft. Hilft, passende Farben zu einer Basisfarbe zu finden.
Ähnlich wie Adobe Color CC, bietet aber mehr Abstufungen innerhlab der gefundenen Farben.
Vorgefertigte Farbpaletten zur Inspiration.
###📰 Typogui.de "Guide to Master Every Day’s Typographic Adventures", sehr kompakter Guide über Typographie. Geht nach den ersten vier Punkten etwas auf distanz, bis dahin sind aber alle Punkte ganz gut geeignet, um sie Checklisten-Mäßig abzuarbeiten.
- Typo—what?
- Fonts vs. Typefaces (eher theoretisch)
- Mixing Typefaces
- Font Size & Line Height
Tool, um passende Fonts zu einer schon ausgewählten zu finden.
Umfassende Sammlung von Fonts, eigentlich für das Benutzen im Web gedacht, können aber auch alle herunter geladen werden.
Zum Download: Schriftart zur Collection hinzufügen, dann oben rechts auf das Download-Icon.
###📰 GoodUI.org An sich eher darauf ausgerichtet, Online eine gute Conversion zu erreichen, aber einige Punkte funktionieren auch ganz gut, wenn man einfach etwas bauen möchte, was gut funktioniert. Beispielsweise:
- Try Merging Similar Functions instead of fragmenting the UI.
- Try Distinct Clickable/Selected Styles instead of blurring them.
- Try Fewer Form Fields instead of asking for too many.
###✅ WebDesignersChecklist.com Kleine Checkliste an der man sich langhangeln kann, aber natürlich auf Designer ausgelegt. Vieles bezieht sich auf den Workflow und die Organisation von Designern, aber ein paar (wenige) Sachen sind auch generell auf das Projekt anwendbar:
- Shapes Aren't Stretched
- Font-sizes smaller than 14-16px render well and are hinted properly for the Web
###✅ IxDChecklist.com Ähnlich wie WebDesignerChecklist, aber mehr auf UX und Interaction Design bezogen. Auch deutlich näher am Projekt.
###📰 Pixel Perfect Precision Ziemlich cooles Handbook, geht in der jetzt 3. Version noch ein Stück weiter von Workflows innerhalb von gestaltungsprogrammen weg und weiter hin zu allgemeinen Tipps.
- Alignment
- Größe von Touch-Elementen
- Benutzen von Farben
- User Feedback
- ... Mittlerweile sehr umfangreich, geht dann in der zweiten Hälft eher auf Photoshop-Workflows ein.
###📰 SVG Workflow
Bisher nur Überflogen
Ziemlich tiefer Guide darüber, wie man vernünftige SVGs erstellt und exportiert.
Eine der größten Seiten zum Zeigen von Designs, aber mit Vorsicht zu genießen, da viele Artefakte nicht auf Basis von Anforderungen aus dem echten leben gebaut wurden.
Showcase, ähnlich wie Dribbble, aber zeigt eher ganze Projekte. AUch hier gilt die Warnung von Dribbble.
Wild gemischter Showcase.
###💾 Pexels
Kostenlose und rechtefreie Stock-Fotos. Die Seite crawlt durch verscheidene andere Stock-Photo-Seiten und nimmt einem damit viel Arbeit ab. Die Lizenz erlaubt es einem, (fast) alles mit den Bildern zu machen, ohen die Quelle nenen zu müssen (Lizenz zum nachlesen
###💾 Distill Kostenlose HD-Videos (z.B. für den Einsatz im Hintergrund)
###💾 Flaticon Umfassende Sammlung von kostenlosen IconPacks
An Hacker News angelehntes Board, das sich um Design-Themen dreht.
Blog um die Themen Design und Web, aber auch andere Meta-Themen.