The five best design links, every weekday

Wednesday08/12

1

learnui.design

The Step-by-Step Guide for Pairing Fonts

I’m going to cut through the crap and give you a step-by-step plan for creating beautiful, professional-quality font pairings.

2

setproduct.com

Summer Top 15 — Figma stuff released recently

Handpicked collection of the newest templates for Figma: UI kits, UX tools, design systems, icons, illustrations and more.

3

brazilianswho.design

Brazilians Who Design

A repository to celebrate the work of talented Brazilian designers and showcase it to the world.

4

nngroup.com

PDF: Still Unfit for Human Consumption, 20 Years Later

Research spanning 20 years proves PDFs are problematic for online reading.

5

kilianvalkhof.com

Supercharging <input type=number>

How to supercharge your <input type=number> so users can increment or decrement by 1, 10, 100 or 0.1 by pressing modifier keys.

The Sidebar Newsletter

5 Design Links in Your Inbox Every Weekday

Tuesday08/11

1

scalablecss.com

Styled Components: A Quick Start Guide

Start practicing styled-components today with this short, actionable guide.

2

medium.com

YouTube Studio App Redesign - UI Case Study

Almost a year back I started posting videos on YouTube and ever since the journey has been incredible.

3

maze.design

Pablo Stanley on life as a remote designer

We caught up with Pablo to talk about life as a remote designer, making your side project your day job, and why everyone loves illustrations.

4

nytimes.com

What Happens to Viral Particles on the Subway

Many New Yorkers are avoiding the subway, fearful of jostling with strangers in crowded cars.

5

ishadeed.com

CSS Mistakes While On Autopilot

When we’re very focused on working on a web project, we tend to forget or do some mistakes that can lead to an invalid CSS code.

Monday08/10

1

fast.design

FAST: The adaptive interface system for modern web experiences

Interfaces built with FAST adapt to your design system and can be used with any modern UI Framework by leveraging industry standard Web Components.

2

fastcompany.com

The 6 wildest design concepts for a virtual Democratic National Convention

Designers share their vision for the first (nearly-all) virtual Democratic National Convention. Biden, time to fire up Twitch!

3

pustelto.com

Optimizing CSS for faster page loads

Learn how CSS affects page load times and how you can improve it by optimizing your CSS build pipeline and the way you load it.

4

malofiejgraphics.com

The New York Times and National Geographic win the Endesa Best of Show Award

In this edition, 162 media outlets from 34 different countries have sent in their works.

5

medium.com

Figma components with a fixed aspect ratio elements

Before Figma Auto Layout our days were dark and full of horror.

Friday08/07

1

web.dev

content-visibility: the new CSS property that boosts your rendering performance

The CSS content-visibility property enables web content rendering performance benefits by skipping rendering of off-screen content.

2

tympanus.net

UI Interactions & Animations Roundup #9

A fresh set of inspirational UI interactions and animations from the past couple of weeks.

3

ishadeed.com

Digging Into the Flex Property

Have you ever wondered about how the CSS flex property works?

4

components.ai

Generative Logo Design

When we first set out to design a logo for Components AI, we naturally gravitated towards generative concepts.

5

figma.com

Behind the feature: shedding light on shadow spread

An engineer’s journey making hard decisions about (seemingly) simple feature requests

Thursday08/06

1

css-tricks.com

Web History Chapter 1: Birth

Tim Berners-Lee is fascinated with information. It has been his life’s work.

2

thisthat.dev

This vs That

What is the difference between this & that in front-end development?

3

rambly.app

Rambly - The Audioconference App To Walk And Talk With Friends

Rambly is a virtual space for events like happy hours, parties, and meetups.

4

css-irl.info

Drop-Shadow: The Underrated CSS Filter

If you’re familiar with CSS, you probably know all about the box-shadow property.

5

fastcompany.com

NASA’s ‘worm’ logo lay dormant for 28 years.

So why are people so obsessed with it?

Wednesday08/05

1

fuse.blog

Fuse - Interesting Internet

A growing collection of creative reference and entertainment.

2

uxdesign.cc

Future Thieving #2 — Speculative design methods and tools

Combining science fiction world-building techniques with design to discover unseen potential futures.

3

css-tricks.com

A Lightweight Masonry Solution

Back in May, I learned about Firefox adding masonry to CSS grid.

4

nngroup.com

Proximity Principle in Visual Design

Design elements near each other are perceived as related, while elements spaced apart are perceived as belonging to separate groups.

5

medium.com

Form design best practices

Learn how to improve the design of digital forms

Tuesday08/04

1

designedbycave.co.uk

The UX of LEGO Interface Panels

Piloting an ocean exploration ship or Martian research shuttle is serious business. Let’s hope the control panel is up to scratch.

2

fastcompany.com

Meet the YouTuber who’s schooling developers on how blind people really use tech

Kristy Viers is here to show the world how you use a phone when you cannot see.

3

css-tricks.com

The Making of: Netlify’s Million Devs SVG Animation Site

The following article captures the process of building the Million Developers microsite for Netlify.

4

frictionlog.com

What is a “Friction Log”?

A friction log is a type of UX experiment where the subject journals their feelings, thoughts, struggles, joys, and any other type of emotion.

5

adamwathan.me

Tailwind CSS: From Side-Project Byproduct to Multi-Million Dollar Business

The story of how a bunch of how a couple of failed SaaS ideas and a bunch of ugly Less stylesheets turned into my life’s work.

Browse Archives