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
180
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
40
SoTM Asia 2017 - Myanmar Presentation
dragonvirus
1
85
Introduction to Progressive Web App
dragonvirus
0
70
Analytic data report with MongoDB
dragonvirus
0
59
Material Design for Developers
dragonvirus
3
150
Other Decks in Design
See All in Design
デザインシステムで解消するさまざまな分断
hirataaa0220
0
160
DMN2024年度プログラム
mct
0
360
社内管理画面のデザインもプロダクトデザイン
takanorip
3
720
Métricas de UX - Reflexões sobre o uso de dados numéricos no contexto de UX
videlvequio
0
150
ダークテーマとアクセシビリティ の融合したカラートークンの設計
degudegu2510
0
280
アイキャッチはFigmaで簡単に作れる!
kubosaya
0
910
顕在化されていない期待、デザインの灯台
daitorii
1
1.1k
root Design Partnership Policy
root_recruit
0
3.9k
マスとAIをなめらかにつなぐデザイン
abcmisuzu
0
240
SUKEDACHI DESIGN NIGHT発表スライド
sugiyama_sukedachi
0
220
実務のための マイクロ インタラクション入門
shingo2000
0
340
2024デザすぷVol.4 新年会/ Design Sprout Bar vol-4
root_recruit
1
300
Featured
See All Featured
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
GraphQLの誤解/rethinking-graphql
sonatard
49
9.2k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
1
3.4k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
501
140k
WebSockets: Embracing the real-time Web
robhawkes
59
7k
How GitHub Uses GitHub to Build GitHub
holman
468
290k
Build The Right Thing And Hit Your Dates
maggiecrowley
23
2k
Art, The Web, and Tiny UX
lynnandtonic
288
19k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
19
1.9k
Happy Clients
brianwarren
91
6.4k
Building Effective Engineering Teams - LeadDev
addyosmani
26
1.8k
A Modern Web Designer's Workflow
chriscoyier
689
190k
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