- Design Machines
- The Billionaire’s Typewriter
- What Screens Want
- The Web’s Grain
- Creative Mornings
- Web Industry: Confidence and Overwhelm
- Is Web Typography Completely Broken?
- Facebook is wrong, text is deathless
- How We Lost 47% of Our Users After a Redesign
- Lessons From Five Years in Mobile News Apps: #1 Don’t have a news app
- Web VS Native
- Web App vs Website
- Fonts unter iOS 7: Was wirklich dahinter steckt
- Using Text Kit to Draw and Manage Text
- http://www.raywenderlich.com/50151/text-kit-tutorial
- iOS Text Kit Basics
- Using Text Kit to Draw and Manage Text
- About Text Handling in iOS
- Apple Developer Style Guide Apple WWDC – Introducing San Francisco Apple WWDC – San Francisco, Typography Apple WWDC – Inclusive Design Apple WWDC – Internationalisation
- John Gruber, Google’s App Aesthetic
- Build a static site with Material Design Lite (framework)
- Google Design
- Material design
- A List Apart, From Pages to Patterns: An Exercise for Everyone
- A List Apart, Style Tiles and How They Work
- Front end styleguides and pattern libraries
- 50 Shades of Corporate Blue
- A new mobile navigation menu
## Style Guides
- Per Harald Borgen – Learn CSS Flexbox in 3 Minutes
- Flexbox Game
- Learn Flex Box With Flex Box Froggy
- Almost complete guide to flexbox (without flexbox)
- CSS Flexbox is logical – almost
- CSS Tricks – A Complete Guide to Flexbox
- Philip Walton – Solved by Flexbox
- Codepen – Flexbox Collection
- Flexbox Patterns
- Using CSS flexible boxes
- Chris Wright – Using Flexbox today
- Layouten mit CSS – Flexbox
- W3Schools – CSS flex Property
- CSS Tricks – Boxes That Fill Height
- HOW TO: Pure CSS masonry layouts
- Rachel Andrew: Should I Use Grid or Flexbox?
- Estelle Weyl – Flexbox: WTF
- Ohans Emanuel – Understanding Flexbox: Everything you need to know
- Device Agnostic
- Mozilla Developer Network: The Viewport
- Responsive Guide to Type Sizing (noch nicht gelesen)
- Everything I Know About Responsive Typography ‘So, here’s what I realized. It’s impossible to apply perfect responsive vertical rhythms across different browsers. At least not with the current technology.’
- Mappy Breakpoints
- Tipy – Sass Maps for Responsive Type (keine Ahnung, ob’s was taugt)
- How You Can Use Responsive Web Components Today
- Google Design, Device Metrics
- Brad Frost – RWD Ressources
- Saving data with Google’s PageSpeed Modules Google’s PageSpeed modules can now auto-generate responsive image syntax.
- Der Viewport, das unbekannte Wesen
- Quirksmode – A Pixel is not a Pixel
- Responsive Images: How they Almost Worked and What We Need
- Native Responsive Images
- HTML5
Element - Srcset and sizes
- Using Responsive Images (Now)
- Using SVG
- Snap SVG – ‘The jQuery of SVG’
- Greensock – Ultra high-performance, professional-grade animation
- Responsive Logos, p1
- Responsive Logos, p2
- How To Work With SVG Text
- How To Work With The SVG Text Spacing Properties
- Styling And Animating SVGs With CSS The Art Of The SVG Filter And Why It Is Awesome
- How SVG Line Animation Works
- The Art Of The SVG Filter And Why It Is Awesome
- SMIL is dead
- nicht sicher, ob das hierhin gehört ai2html
- Animating the Viewbox
- Optimising SVGs for Web Use — Part 1
- Optimising SVGs for Web Use — Part 2
- Optimising SVGs for Web Use — Part 2½
- Sara Soueidan: Animated SVG vs GIF
- Una Kravets: Finessing
feColorMatrix
- Tools And Resources For Editing, Converting And Optimizing SVGs
- Boxy, online SVG editor
- SVG Gradients and Filters
- One of the biggest mistakes I’ve made in my career
- Scratch – Create stories, games, and animations Share with others around the world
- The Elements of Typographic Style Applied to the Web Leider weit davon entfernt, komplett zu sein
- Blokk Neue
- Flat Design an Studis gemailt
- Fashionable Nonsense an Studis gemailt
- NASA API
- Blending Modes Demistified
- An inventory of typographic tools
- Marcin Wichary – Typography is impossible
- The Intercept
- MIT Technology Review
- New York Times, Rise and Shine
- Keller Theater Winterthur Anton Studer
- Hip Hop Quoted
- Malika Favre
- Harpe 45
- Navigating Responsibly
- Washington Post – THE INSIDE STORY OF WHEN RUN‑DMC MET AEROSMITH AND CHANGED MUSIC FOREVER
- Richard Rutter – CSS 3 Sandbox, OpenType Features
- Type Specimens
- The State of Web Type
- Caring About Open Type Features
- CSS and System Fonts
- Emily King, 2001: Digital type decade
- Kerning on the Web
- Type study: Hi-DPI web typography
- The State of Web Type
- em/rem
- kerning.js
- lettering.js
- Font Bureau, Vertrieb
- Typewolf
- I left my system fonts in San Francisco
- How to use system typefaces in web projects
- Bram Stein: Web Font Loading Patterns
- Bram Stein: PostCSS plugin to scale values
- Bram Stein – Hyphenation & Justification (und vieles mehr)
- The Web Fonts: Preloaded
- Please, No More Open Sans For A While
- Nick Sherman – Variable Fonts for Responsive Design
- Nick Sherman – Responsive Typography is a Physical Discipline, But Your Computer Doesn’t Know It (Yet)
- Size Calculator
- Make It Move with Erik van Blokland
- Jeremy Hornus – Live Optical Sizing
- Nina Stoessinger
- Designing Between Points
- Tim Brown: The web is terrible for typography!
- Tim Brown – Typesetting Body Text
- Tim Brown – Flexible Typography with CSS Locks
- Smashing Magazine – Truly Fluid Typography With vh And vw Units
- Vasilis van Gemert
- Nathan Ford – Fluid typography with viewport units
- John Hudson – Introducing OpenType Variable Fonts
- Variable Fonts Announcement
- Tim Brown – Variable fonts, a new kind of font for flexible design
- John Hudson – Introducing OpenType Variable Fonts
- Matthew Butterick – The Scorpion Express: Thoughts on OpenType Font Variations
- Florian Schulz (Ginetta) – Designing with intent
- Jen Simmons: The Layouts Ahead
- Skeleton: A dead simple, responsive boilerplate
- Golden Grid
- Typeform
- Bootstrap
- HTML5 Boilerplate
- Foundation
- Yaml
- YUI
- jQuery
- Google Developers
- The future of layout with CSS: Grid Layouts
- Bourbon, Neat
- CSS Tricks: Complete Guide to Grids
- Tutorial: Building a Home Page with Grid
- Grid Resources
- CSS Grid Inspector
- The New CSS Layout
- Rachel Andrews – CSS Layout
- Gutenberg – A Meaningful Web Typography Starter Kit
- Vasilis van Gemert – Create the perfect website layout system
- Exploring Dynamic Layout in Sketch
- Getting Set Up With Sketch
- Silver
- Typesetting in Sketch
- iPhone UI Kit
- Free Stock Photo Websites
- Unsplash
- Little Visuals
- Muster: The Pattern Library
- Muster: Subtle Patterns
- GIF
- Marvel
- Origami (Facebook)
- Form (Google)
- Principle (Animation)
- Obsolet: Pixate
- Proto
- Flinto (Animation)
- Hype 3
- Framer (Animation)
- Keynote
- Keynote
- Keynote
- Keynote
- Prototyping Tools and Process
- 30 Free Web and Mobile Wireframe Templates
- Survey: Favourite Tools
- Atomic
- Atomic wants to be Google Docs for Designers
- Sketch 3 Plugins
- Design Tools News N° 7
- UX App
- Webflow
- Übersicht zu barrierefreien Web-Applikationen und Komponenten
- Code Sniffer
- Responses To The Screen Reader Strategy Survey
- The Journalist-Engineer
- Wired: Postcards DataViz
- Rddj
- Designing Data-Driven Interfaces
- Designing with Analytics
- Film Dialogue from 2000 screenplays, Broken Down by Gender and Age
- hyphenator.js
- lettering.js
- dragula
- storymap.js
- timeline.js
- FitText
- Colorify Rocks
- Node Vibrant
- Popcorn.js – media framework
- d3js – Data Driven Documents
- Phantom.js
- Unheap
- Scrollmagic
- Typeset.js
- Leaflet
- Rachel Nabors: Web Animation Past, Present, and Future
- Microinteractions: The Secret of Great App Design
- Distorted Button Effect
- carpe diem 2016(nettes beispiel, komplett over the top)
- Smart Transitions
- Make an animated GIF with Keynote
- 7 Tips for Designing Awesome GIFS
- Disney's 12 Basic Principles of Animation
- http://the12principles.tumblr.com/
- Pure CSS Parallax Scrolling
- How to animate "box-shadow" with silky smooth performance
- Val Head
- Val Head: All The Right Moves Screencast
- All you need to know about CSS Transitions
- Practical Techniques On Designing Animation
- TRIGGER CSS ANIMATIONS ON SCROLL
- A Guide to SVG Animations (SMIL)
- Styling And Animating SVGs With CSS
- Styling Animations with LERP
- Swiss Typography in CSS
- Animating CSS Shapes with CSS Animations and Transitions
- How To Integrate Motion Design In The UX Workflow
- Multilayered Parallax, CSS/Javascript
- UI Talks, Animation
- Smashing Magazine: Functional Animation in UX Design
- Sarah Drasner: Practical Techniques On Designing Animation
- Motion Periodic Table
- Readymag Animations
- Eloquent Javascript
- Dan Shiffman, Resources
- How to learn JavaScript properly
- Podcasts
- Principles of Writing Consistent, Idiomatic JavaScript
- Murphey: adventures in javascript Leitfaden
- Paul Irish: Ten Things I Learned from the JQuery Source
- Prototypal Object-Oriented Programming using JavaScript
- Embrace prototypal object-oriented programming
- jquery UI
- jquery Effects
- stellar.js, Parallax Scrolling
- Popmotion.js
- The Wild Path – An Interactive Storytelling Experiment
- React – Examples
- Scroll Trigger – Scroll Based Animations
- mojs.io
- Hiding Things with CSS
- Scroll Snap Points
- Dropbox CSS, Move Slow and Fix Things
- MDN – CSS Coding Techniques
## CSS Animation
- You don’t need JavaScript
- Portal CSS, Tutorial
- Val Head, Designing Safer Web Animation For Motion Sensitivity
- Why iOS 7 is making some users sick
- Val Head, All the right moves screencast
- Val Head, UI Animation and UX: A Not-So-Secret Friendship
- Val Head, More Resources for Accessible Animations
- CSS Keyframes
- Interview with Rachel Smith, Egineer at CodePen
- Stack Overflow: How to parse a RSS feed using javascript?
- Google Feed API
- Displaying RSS feeds easily using Google Ajax Feed API
- jFeed
- A List Apart – What Really Matters: Focusing on Top Tasks
- The Web Ahead, Interview with Gerry McGovern
- Testing Time, Zürich
- Simone Reichlin – Measuring Visual Design
- Processing.org
- Introduction To Programming For The Visual Arts With p5.js
- Moving Self-initiated animated art project
- Casey Reas
- Casey Reas Interview
- Interview with Casey Reas and Ben Fry
- John Maeda, Design by Numbers
- p5.js
- Dan Shiffman, p5.js Introduction (Playlist)
- Looking Inside p5
- p5.speech
- Drawbot
- Tutorial: Creating an animated gif with Python in DrawBot
- David Jonathan Ross’ Github Repo
- FontTools
- Complete Beginner’s Guide to Interaction Design
- 25 Useful Free Tools & Apps For Web Designers from 2015
- The 8 Worst UX Mistakes Coming From Experts
- A 5 day sprint with Clear Left exploring library self-service machine software
- Slack
- User Snap
- Why you need to use Trello for damn near everything
- Maybe we could tone down the JavaScript
- Reimagining Single-Page Applications With Progressive Enhancement
- Interaction is an Enhancement
- Jeremy Keith –Jeremy Keith – Regressive Web Apps
- Why Britain Banned Mobile Apps
- Why we use progressive enhancement to build GOV.UK
- How many people are missing out on JavaScript Enhancement?
- Government Digital Service – Design Principles
- Google Dev – Progressive Web Apps
- Universal JavaScript
- Christian Heilmann – We need JavaScript to fix the web
- John Gruber – Markdown
- Good ways to view markdown files as you're writing them?
- Mou – Markdown Editor
- Marked – Markdown Preview / Tool
- Technical Development Guide (How to Become a Programmer)
- The Book of Shaders Gehört ev. eher zu Processing/p5.js/drawbot/visual programming
- Cube Composer
- MDN – Service Worker API
- Introduction to Service Worker
- Google Developers – Get started with Service Worker
- Mozilla Service Worker Cookbook
- The copy & paste guide to your first Service Worker
- The Absolute Minimum Every Software Developer Absolutely, Positively Must Know About Unicode
- What Every Programmer Absolutely, Positively Needs To Know About Encodings And Character Sets To Work With Text
- The front-end side of news Front-end metrics from big news sites around the world.
- HOW HTTP/2 WILL SPEED UP THE WEB