@WebFieldManual

The Web Field Manual is a curated list of resources focused on documenting only the best knowledge for designing experiences and interfaces on the web.

webfieldmanual.com
Joined May 2014
  • Tweets574
  • Following61
  • Followers1.2K
18Media
Android Pixel Calculator: Check relation between the dp, px, sp, in, mm and pt measurement units and convert to other unit. angrytools.com/android/pixel…
2
How To Learn CSS: An article that aims to guide you along the path of learning CSS Fundamentals. smashingmagazine.com/2019/01…

How To Learn CSS — Smashing Magazine

You don’t need to commit to memorizing every CSS Property and Value, as there are good places to look them up. There are some fundamental things, however, which will make CSS much easier for you to...

smashingmagazine.com
3
2
SVG Gradient Map Filter: A tool that creates SVG Gradient Map Filter from given colors. yoksel.github.io/svg-gradien…
1
Remove Image Background: Quick background removal for images with one click. remove.bg/
Design Libs: A go-to reference for how to write and use some of the most common design thinking exercises, practices, and methods. designlibs.com/about.html
The Elements of UI Engineering: A thoughtful look at the elements that go into front-end interfaces. overreacted.io/the-elements-…
Palx: Provide a single color value and Palx returns a full-spectrum color palette, well suited for UI design and data visualizations that work harmoniously with brand colors. palx.jxnblk.com/
3
Cedar: The Cedar Design System provides digital teams with reusable UI components based on REI’s visual language. rei.github.io/rei-cedar-docs…
1
Degreeless.design: A list of useful information for learning design for budding UX, UI, and Interaction designers. degreeless.design/
2
33 Concepts Every JavaScript Developer Should Know: A repository created with the intention of helping developers master their concepts in JavaScript. github.com/leonardomso/33-js…
1
Web.Dev: With actionable guidance and analysis, web.dev helps developers like you learn and apply the web's modern capabilities to your own sites and apps. web.dev/
1
Accessibility Cheatsheet: Practical approaches to Universal Design for making your website/webapp accessible to everyone. moritzgiessmann.de/accessibi…

Accessibility Cheatsheet

Practical approaches to Universal Design for making your website/webapp accessible to everyone

moritzglantz.de
2
30 Seconds of CSS: A curated collection of useful CSS snippets you can understand in 30 seconds or less. 30-seconds.github.io/30-seco…
1
The Psychology of Design: Three key theories of psychology that designers can use to build more intuitive, human-centered products. alistapart.com/article/psych…

The Psychology of Design

As humans, we have an underlying “blueprint” for how we perceive and process the world around us, and the study of psychology helps us define this blueprint. And as designers, we can leverage psych…

alistapart.com
1
Web Field Manual retweeted
zeldman
@zeldman5 Oct 2018
Q. Should designers code, write, or understand business? A. Yes. And one more thing: to do our jobs, we designers must learn the fundamentals of psychology. @JonYablonski explains why. alistapart.com/article/psych…

The Psychology of Design

As humans, we have an underlying “blueprint” for how we perceive and process the world around us, and the study of psychology helps us define this blueprint. And as designers, we can leverage psych…

alistapart.com
1
7
3
22
UX Tools: Resources for the modern day UX designer: compare UX design tools, find books, and keep up with the industry. @uxtoolsco uxtools.co/
3
Uniform: A single design system to ensure every interface feels like Hudl. uniform.hudl.com/
1
Werner’s Nomenclature of Colours: A recreation of the original 1821 color guidebook with new cross references, photographic examples, and posters designed by Nicholas Rougeux. c82.net/werner/
1
2
Feature Queries Manager: A browser extension tool to help manage and toggle CSS on a page behind a @supports Feature Query. github.com/ireade/feature-qu…

GitHub - ireade/feature-queries-manager: 🛠Toggle CSS styles within @supports blocks

🛠Toggle CSS styles within @supports blocks. Contribute to ireade/feature-queries-manager development by creating an account on GitHub.

github.com
1
1
Using Feature Detection to Write CSS with Cross-Browser Support: A look at dealing with inconsistent browser support with a key feature in the design of the CSS language itself. css-tricks.com/using-feature…

Using Feature Detection to Write CSS with Cross-Browser Support | CSS-Tricks

In early 2017, I presented a couple of workshops on the topic of CSS feature detection, titled CSS Feature Detection in 2017.

css-tricks.com
Load more