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
Developers as Intentional Designers
Search
Lynn Fisher
April 26, 2014
Technology
1
980
Developers as Intentional Designers
A talk from JSConf Brazil, Fortaleza.
Lynn Fisher
April 26, 2014
Tweet
Share
More Decks by Lynn Fisher
See All by Lynn Fisher
Art, The Web, and Tiny UX
lynnandtonic
299
21k
A Different Kind of UX
lynnandtonic
9
1.3k
Illustration with CSS
lynnandtonic
9
3.9k
Be Good At Lots of Things
lynnandtonic
7
1.3k
I’ll Be Awesome At Lots of Things, Thank You Very Much
lynnandtonic
4
390
Illustrating With Heart
lynnandtonic
3
510
Other Decks in Technology
See All in Technology
How Community Opened Global Doors
hiroramos4
PRO
1
120
Windows 11 で AWS Documentation MCP Server 接続実践/practical-aws-documentation-mcp-server-connection-on-windows-11
emiki
0
1k
生成AIで小説を書くためにプロンプトの制約や原則について学ぶ / prompt-engineering-for-ai-fiction
nwiizo
4
2.4k
Lambda Web Adapterについて自分なりに理解してみた
smt7174
5
130
本が全く読めなかった過去の自分へ
genshun9
0
580
AIのAIによるAIのための出力評価と改善
chocoyama
2
580
変化する開発、進化する体系時代に適応するソフトウェアエンジニアの知識と考え方(JaSST'25 Kansai)
mizunori
1
230
2025-06-26_Lightning_Talk_for_Lightning_Talks
_hashimo2
2
100
Amazon S3標準/ S3 Tables/S3 Express One Zoneを使ったログ分析
shigeruoda
4
550
mrubyと micro-ROSが繋ぐロボットの世界
kishima
2
340
セキュリティの民主化は何故必要なのか_AWS WAF 運用の 10 の苦悩から学ぶ
yoh
1
180
PHP開発者のためのSOLID原則再入門 #phpcon / PHP Conference Japan 2025
shogogg
4
860
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
337
57k
Measuring & Analyzing Core Web Vitals
bluesmoon
7
490
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.9k
What's in a price? How to price your products and services
michaelherold
246
12k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
357
30k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2.1k
Making the Leap to Tech Lead
cromwellryan
134
9.4k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.7k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.3k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
How GitHub (no longer) Works
holman
314
140k
Raft: Consensus for Rubyists
vanstee
140
7k
Transcript
DEVELOPERS AS INTENTIONAL DESIGNERS Lynn Fisher @ lynnandtonic
None
None
None
None
None
None
DESIGN DEVELOPMENT
DESIGN DESIGN DEVELOPMENT DEVELOPMENT
DESIGN DESIGN DESIGN DEVELOPMENT
DESIGN + DEVELOPMENT
DEVELOPERS AS INTENTIONAL DESIGNERS
DEVELOPERS DECIDING TO BE DESIGNERS —DESIGNING WITH PURPOSE & ON
PURPOSE
None
SPECIALIZATION IS A GOOD THING
CONFLICT IS A GOOD THING
CONSTRUCTIVE CONFLICT IS A GOOD THING
BUT SOMETIMES IT’S JUST YOU
SORRY
SORRY I’M NOT A DESIGNER
STOP APOLOGIZING
YOU GOTS THE SKILLZ
MODULARITY & REUSABILITY
MODULE
DON’T REPEAT YOURSELF
REUSE
MODULE
CONSISTENCY
2 SPACES 4 SPACES >
2 SPACES 4 SPACES <
CONSISTENCY!
@ brad_frost
HIERARCHY
1 2 3 4 5
ORDER
ORDER GROUPING
ORDER GROUPING SIZE
READABILITY
section.readability h1 Look at this contrast! p Your text editor
has some really helpful colors for strong readability. a(role=“example”) See? p It’s awesome! 1 2 3 4 5 6 7 8
IS IT READABLE?
STICK WITH HIGH CONTRAST. LOW CONTRAST CAN BE HARDER TO
READ.
UP THAT FONT SIZE. DON’T MAKE PEOPLE SQUINT.
MAKE THOSE LINKS OBVIOUS. LIKE, IS THIS EVEN A LINK?
TOOLS
+ 1 2 3 4 5 6 7 8 9
10 11 12 13 <!DOCTYPE html> <html> <head> <title>JSConfBR</title> </head> <body> <div class=“content”> <h1>Welcome!</h1> </div> </body> </html> <title>JSConfBR</title> </head> <body> <div class=“content”> .content margin: 0 padding: 10px
@ spiralstairs
RECAP
MODULARITY RECAP
MODULARITY RECAP REUSABILITY
MODULARITY RECAP REUSABILITY CONSISTENCY
MODULARITY RECAP REUSABILITY CONSISTENCY HIERARCHY
MODULARITY RECAP REUSABILITY CONSISTENCY HIERARCHY READABILITY
MODULARITY RECAP REUSABILITY CONSISTENCY HIERARCHY READABILITY TOOLS
VISUAL DESIGN
None
GO TEAM!
PRACTICE
AIN’T NOBODY GOT TIME FOR THAT
START SMALL
CLICK HERE! SUBMIT NAME EMAIL PHONE CANCEL OK
NOT EVERY PROJECT IS A REDESIGN
CONSISTENCY (REMEMBER?)
RECREATE & REDESIGN
REDESIGN OFTEN
REDESIGN OFTEN & QUICKLY
DRAW SOMETHING EVERY DAY
1. SOMETHING YOU CAN SEE
1. SOMETHING YOU CAN SEE 2. SOMETHING YOU IMAGINE
None
1. SOMETHING YOU CAN SEE 2. SOMETHING YOU IMAGINE
CREATE A VISUAL REPRESENTATION OF WHAT YOU SEE WITH YOUR
EYES
CREATE A VISUAL REPRESENTATION OF WHAT YOU SEE WITH YOUR
EYES AND WHAT YOU SEE WITH YOUR MIND
SO OTHERS CAN SEE WHAT YOU SEE
SHOW OTHERS YOUR WORK
“ONLY THOSE WHO ARE WILLING TO TAKE THE RISK OF
WRITING CODE THAT’S NOT PERFECT EVER WRITE CODE.” - MICHAEL “GAR” GARVIN
SHAPE THE COMMUNITY
RECAP
START SMALL RECAP
START SMALL RECAP REDESIGN & RECREATE
START SMALL RECAP REDESIGN & RECREATE DRAW SOMETHING EVERY DAY
START SMALL RECAP REDESIGN & RECREATE DRAW SOMETHING EVERY DAY
SHOW YOUR WORK
START SMALL RECAP REDESIGN & RECREATE DRAW SOMETHING EVERY DAY
SHOW YOUR WORK SHAPE THE COMMUNITY
HOW TO WORK WITH DESIGNERS
EVERY “HOW TO WORK WITH X PERSON” ARTICLE OR TALK
EVERY “HOW TO WORK WITH X PERSON” ARTICLE OR TALK
CAN BE SUMMED UP WITH UNDERSTAND THEM & APPRECIATE THEM.
IT’S NOT JUST ABOUT DESIGNERS
DESIGNERS AS INTENTIONAL DEVELOPERS
STOP APOLOGIZING
YOU’RE DOING THIS
THANK YOU Lynn Fisher @ lynnandtonic