Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Fast Design Decision-Making for the Everyday De...
Search
Julie Ann Horvath
December 01, 2012
Programming
15
1.1k
Fast Design Decision-Making for the Everyday Developer
Julie Ann Horvath
December 01, 2012
Tweet
Share
More Decks by Julie Ann Horvath
See All by Julie Ann Horvath
Engineering Learning Lunch on Writing CSS as a Team
nrrrdcore
1
220
Because People
nrrrdcore
7
1.4k
Coder Day Of Service Keynote
nrrrdcore
3
640
Just Ship It
nrrrdcore
37
4.3k
Open Source Needs More Design Superheroes
nrrrdcore
10
780
GitHub for Designers
nrrrdcore
18
2.6k
Building a Design Environment
nrrrdcore
16
15k
JS.CONF.EU 2012 - Because F$%k Photoshop
nrrrdcore
16
4.7k
GitHub Summit 2012
nrrrdcore
5
950
Other Decks in Programming
See All in Programming
Claude Codeと2つの巻き戻し戦略 / Two Rewind Strategies with Claude Code
fruitriin
0
120
それ、本当に安全? ファイルアップロードで見落としがちなセキュリティリスクと対策
penpeen
7
3.9k
なぜSQLはAIぽく見えるのか/why does SQL look AI like
florets1
0
470
今から始めるClaude Code超入門
448jp
8
8.9k
CSC307 Lecture 09
javiergs
PRO
1
840
QAフローを最適化し、品質水準を満たしながらリリースまでの期間を最短化する #RSGT2026
shibayu36
2
4.4k
MDN Web Docs に日本語翻訳でコントリビュート
ohmori_yusuke
0
650
Vibe Coding - AI 驅動的軟體開發
mickyp100
0
180
疑似コードによるプロンプト記述、どのくらい正確に実行される?
kokuyouwind
0
390
Apache Iceberg V3 and migration to V3
tomtanaka
0
160
Package Management Learnings from Homebrew
mikemcquaid
0
230
AI Schema Enrichment for your Oracle AI Database
thatjeffsmith
0
300
Featured
See All Featured
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
Optimizing for Happiness
mojombo
379
71k
Facilitating Awesome Meetings
lara
57
6.8k
Ethics towards AI in product and experience design
skipperchong
2
190
Become a Pro
speakerdeck
PRO
31
5.8k
New Earth Scene 8
popppiees
1
1.5k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
340
Believing is Seeing
oripsolob
1
56
More Than Pixels: Becoming A User Experience Designer
marktimemedia
3
320
Digital Projects Gone Horribly Wrong (And the UX Pros Who Still Save the Day) - Dean Schuster
uxyall
0
370
Stewardship and Sustainability of Urban and Community Forests
pwiseman
0
110
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Transcript
SUPER FAST DESIGN DECISION-MAKING
@ @ NRRRDCORE
I’M A DESIGNER BUT IT’S A LITTLE COMPLICATED
I BUILD THINGS A LITTLE LESS COMPLICATED, RIGHT?
None
& EARLY & OFTEN FRESH SHIPPING DAILY.
NOT THIS KIND, THOUGH.
A WEBSITE’S DESIGN SHOULD START WHERE IT’S GOING TO LIVE.
LESS ABOUT ME AND MORE ABOUT FAST DESIGN...
MORE ABOUT YOU AND DEVELOPER FRIENDLY DESIGN TOOLS...
PARTS FOR A FASTER DESIGN PROCESS. 3 3
3 3 STEPS BUILD, DEPLOY, & ITERATE.
START SIMPLE TO FIND THE RIGHT DIRECTION...
START SIMPLE TO FIND ANY DIRECTION, REALLY...
START ON PAPER I KNOW WHAT YOU’RE THINKING, PAPER...
DON’T FEAR THE BLANK CANVAS
A FOUNDATION YOU DON’T HAVE TO START FROM SCRATCH.
THE BASICS WHAT’S IN A CSS “FRAMEWORK”?
THE ANSWER PROBABLY A LOT OF STUFF YOU DON’T NEED
PICK AND CHOOSE THE PARTS THAT’LL BE USEFUL...
PICK AND CHOOSE THE PARTS THAT ADDRESS AN ACTUAL NEED.
BE CHOOSEY OR, USE THE FRAMEWORK AS A FOUNDATION
EVENTUALLY YOU’LL WANT TO RIP OUT WHAT YOU’RE NOT USING.
* *
GRIDS CAN BE REALLY USELESS
None
GRIDS BUT THEY CAN HELP YOU FORMAT CONTENT.
960.GS THE ORIGINAL GANGSTER
960.GS THE ORIGINAL BOOKMARKLET
None
FRESH POTS SOME GRIDS COME BAKED INTO FRAMEWORKS.
BOOTSTRAP SKELETON FOUNDATION & &
THEY’RE FLEXY THEIR GRIDS ARE FLUID, FOR ALL OF YOUR
MOBILE THINGS.
None
MEDIA QUERIES ARE REALLY, REALLY AWESOME. @ @
CONDITIONAL CSS BASED ON THE WIDTH OF THE DEVICE.
None
... PATTERN LIBRARIES CONSTANTLY IMPROVE THE WAY YOU WRITE MARKUP
...
None
None
None
VISUAL PATTERNS DRIBBBLE BUCKETS CAN HELP...
None
DRIBBBLE.COM/NRRRDCORE/BUCKETS
None
None
CSS3EXP.COM/MOON
ICON FONTS SAVED MY LIFE * *
span.mega-icon.mega-icon-blacktocat
.mega-icon.mega-icon-blacktocat
SASS/SCSS WHY SHOULD YOU CARE?
THE COMMUNITY IS OPINIONATED, THE COMPUTER DOESN’T CARE.
border-top-color: lighten($gray, 10%);
border-bottom-color: darken($gray, 10%);
SASS/SCSS HANDLES ERRORS LIKE A CHAMP.
None
WORK WITHIN CONSTRAINTS WHEN YOU’RE DESIGNING, BUILDING... * *
STYLEGUIDES AREN’T JUST FOR COLOR PALETTES
None
KSS
None
WARPSPIRE.COM/KSS/STYLEGUIDES
PROTOTYPING IS EASY WHEN YOU WRITE CODE.
GISTS A LIGHT-WEIGHT PROTOTYPING TOOL.
STAY LIMBER YOU CAN DO MORE WITH GISTS THAN YOU’D
EXPECT.
None
None
None
None
None
PULL REQUESTS ARE AN AWESOME DESIGN TOOL.
JULIEANNHORVATH.COM/RESOURCES
THANK YOU WARM GUN ’12 & 500 STARTUPS