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
Design for Developers
Search
Li Jia Li
March 29, 2015
Design
1
200
Design for Developers
Design Hacks for Developers
Talks @ Women Tech Maker (Yangon) 2015
Li Jia Li
March 29, 2015
Tweet
Share
More Decks by Li Jia Li
See All by Li Jia Li
UX is more than UI
dragonvirus
0
48
SoTM Asia 2017 - Myanmar Presentation
dragonvirus
1
130
Introduction to Progressive Web App
dragonvirus
0
81
Analytic data report with MongoDB
dragonvirus
0
67
Material Design for Developers
dragonvirus
3
170
Other Decks in Design
See All in Design
Yumika Yamada Portfolio
yumii
0
1.6k
CursorでAI活用のナレッジベースを構築する
kanzaki
0
670
Portfolio 齋藤明敏 Hiroyuki Saito_守秘義務あり
crearedesign
0
290
株式会社ログラス - 会社説明資料【デザイナー】/ Loglass Designer
loglass2019
1
2.4k
AI時代に、僕たちデザイナーはどう歩むか
kazuhirokimura
0
370
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
250
Yahoo!フリマ:生成AI利用機能ならではのインターフェース設計について / Yahoo! JAPAN Flea Market: Interface Design Specific to Generative AI Utilization Features
lycorptech_jp
PRO
0
460
#Dubois Challenge 2025: Economics
ajstarks
1
170
Installing and Running decksh/pdfdeck
ajstarks
1
840
ランドマークが光る!季節を彩るナビ体験 - Mobility Night #3 -
kitau
0
120
Marpで推しCSSスライドを作ろう! / marp-with-favorite-css
fujiemon
0
590
CMS管理画面のアクセシビリティ
magi1125
8
2.5k
Featured
See All Featured
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
Reflections from 52 weeks, 52 projects
jeffersonlam
352
21k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
What's in a price? How to price your products and services
michaelherold
246
12k
How STYLIGHT went responsive
nonsquared
100
5.8k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
Side Projects
sachag
455
43k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
GitHub's CSS Performance
jonrohan
1032
460k
Testing 201, or: Great Expectations
jmmastey
45
7.7k
Thoughts on Productivity
jonyablonski
70
4.8k
Fireside Chat
paigeccino
39
3.6k
Transcript
Design for Developers by Pwint Phyu Kyaw [ Yangon ]
Who am i ? My name is Pwint Phyu Kyaw
a.k.a Li Jia Li. I’m a backend PHP Developer who also know a little about design. I’m a co-founder of Hexcores. Mission of the Hexcores is to simplify people life with technology.
Why is design important ?
It’s not just what it looks like and feels like.
Design is how it works. !
Users don’t see your code. They just see the UI
of your app.
While (!functional_design){ iterate(); //Failure is on its way! } Reference
: https://speakerdeck.com/prtksxna/interface-design-for-developers
Don’t worry
You just need some tools to solve the problems.
Design Hacks
Typography Image Source : http://abduzeedo.com/typography-mania-19
Typography is the King.
None
Typography Tools http://hellohappy.org/beautiful-web-type/
Typography Tools http://www.google.com/fonts
Typography Tools http://www.typegenius.com/
Typography Tools http://www.typegenius.com/
WhatFont http://chengyinliu.com/whatfont.html Available in • Bookmarklet • Chrome Extension •
Safari Extension
No more than two typefaces.
Let the content breath.
None
Visual Hierarchy ( Font Weight + Size + Color )
Registration Successful ! User Account Information Jonathan Doe
[email protected]
Registration
Successful ! User Account Information Jonathan Doe
[email protected]
Color
Don’t know which color to use ?
Google Material Colors http://www.google.com/design/spec/style/color.html
Flat UI colors http://flatuicolors.com/
Adobe Color CC https://color.adobe.com
Use icons in design " ♥ $ %
UX Design
What is UX Design ? • User-centered design • Usability
• Interface design • Prototyping • Interaction design • Information architecture • Blah blah blah ……………………………………………….
Use UI patterns which are already used.
Learn from others
http://www.pttrns.com
Resources
http://www.google.com/design/
https://hackdesign.org
Design School for Developers http://webdesign.tutsplus.com/series/design-school-for-developers--webdesign-13793
http://agiledesigners.com
Thanks for listening. & @EyeOfDragonLi