Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Creating a UI Design culture
Search
Satoru Kawahara
September 05, 2014
Technology
2.7k
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Creating a UI Design culture
インフラ企業で働くフロントエンドエンジニアの挑戦(編集版)
デブサミ関西 2014 B4セッション発表資料 #kansumiB4
Satoru Kawahara
September 05, 2014
Transcript
74 slides
#kansumiB4 !%FWFMPQFST4VNNJU,BOTBJ 屎⾱鋙 ؎ٝؿٓ⟰噟ד⫴ֻ ؿٗٝزؒٝسؒٝآص،ך 䮋䨌 箟꧊晛
#kansumiB4 כׄח ֿךأٓ؎سך鋅倯
#kansumiB4 ַֿ֮ג6*رؠ؎ٝח《 穈הծְֲֲֿֿהַָ֮ ׃זְծהְֲ罋ח ؿٗٝزؒٝسؒٝآص،6*رؠ؎ش٦ך倯פ
#kansumiB4 ؿٗٝزؒٝسؒٝآص،6*رؠ ؎ش٦כְֲֲֿֿה䙼גְ ַ׃זְծהְֲ罋ח ך➭ךؒٝآص،ך倯פ
#kansumiB4 荈䊹稱➜
#kansumiB4 屎⾱鋙 !FTVLFJ ַכ ׁה 荈䊹稱➜
#kansumiB4 ؿٗٝزؒٝسؒٝآص، 6*رؠ؎ش٦ 荈䊹稱➜
#kansumiB4 ֻׁך714؝ٝزٗ٦ٕػطٕך 6*رؠ؎ٝؿٗٝزؒٝس涪 ⚺ח䬐䔲 荈䊹稱➜
#kansumiB4 ˖ ؿٗٝزؒٝس涪橆㞮ך何㊣ ˖ 6*رؠ؎ٝ䩛岀ך何㊣ 荈䊹稱➜
#kansumiB4 穗娖 荈䊹稱➜
#kansumiB4 㢳䷐繟遭㣐㷕 䞔㜠رؠ؎ٝ㷕猰 䞔㜠رؠ؎ٝ؝٦أ 荈䊹稱➜
#kansumiB4 ؐؑـⵖ⡲⠓爡 荈䊹稱➜ ؐؑـ؟؎زⵖ⡲ 8FC؟٦ؽأך涪٥麊㌀
#kansumiB4 8FCرؠ؎ش٦ה׃גⰅ爡 "DUJPO4DSJQU⳿勻رؠ؎ش٦ ؟٦غ؟؎س鍗رؠ؎ش٦ ر٦ةإٝة٦חⰅֿה֮رؠ؎ش٦
תחرؠ؎ֽׅٝוקרؒٝآص، 荈䊹稱➜ 肔剅ֹך㢌⻉
#kansumiB4 ! ! ! 涪鿇؎ٝة٦ؿؑ؎أ鏣鎘䬐䔲 荈䊹稱➜
#kansumiB4 ֻׁךٖٝةٕ؟٦غ 㹑⠗
#kansumiB4 ֻׁך㼔欽؟٦غ 㹑⠗
#kansumiB4 ֻׁך714 㹑⠗
#kansumiB4 ֻׁךؙٓؐس 㹑⠗
#kansumiB4 ر٦ةإٝة٦ 㹑⠗
#kansumiB4 暟椚ַؙٓؐسתד 䌴䎢ֻ䪔ֲ*5؎ٝؿٓ⠓爡 㹑⠗
#kansumiB4 䮋䨌ך
#kansumiB4 Ⰵ爡䖓٠剢ְֻד714؝ٝزٗ٦ٕػطٕ ךٔصُ٦،ٕ周⟝ח⸇ 䮋䨌ך714؝ٝزٗ٦ٕػطٕךٔصُ٦،ٕ
#kansumiB4 714ず㡦䱸竲ׅٗ٦ٕؕطحز ٙ٦ؙ䱸竲堣腉䲿⣘ 堣腉鷄⸇ 䮋䨌ך714؝ٝزٗ٦ٕػطٕךٔصُ٦،ٕ
#kansumiB4 ˖ ؟٦غ♧鋮ׅ ˖ أ؎حثך鷄⸇ꤐ♧鋮 ˖ ؟٦غהأ؎حثך䱸竲 ؝ٝزٗ٦ٕػطٕח鷄⸇
#kansumiB4 䮋䨌ך714؝ٝزٗ٦ٕػطٕךٔصُ٦،ٕ ˖ הה؟٦غ〴ך邌爙٥乼⡲䟝㹀ׁגְך ˖ ֿך歗ך䒀ꞿ简♳דך⥜姻כꨇ׃ְ
#kansumiB4 䮋䨌׃ֿה 䮋䨌ך714؝ٝزٗ٦ٕػطٕךٔصُ٦،ٕ
#kansumiB4 ˖ הִ֮׆תדך荈ⴓך䠬鋙ד 6*رؠ؎ٝ涪װג 䮋䨌ךהִ֮׆עאַג
#kansumiB4 עאַ㠖ך 䮋䨌ךהִ֮׆עאַג
#kansumiB4 6*رؠ؎ׅٝ 俑⻉ָזְ 䮋䨌ך6*رؠ؎ׅٝ俑⻉ָזְ
#kansumiB4 תדך 714؝ٝزٗ٦ٕػطٕ 6*رؠ؎ٝ 䮋䨌ך6*رؠ؎ׅٝ俑⻉ָזְ
#kansumiB4 㹋鄲ׅ堣腉ָ⳿䲧ֲ 䎢㜠㹑⠗ך鿇縭ךرؠ؎ش٦ח涪岣 㸣䧭׃)5.-$44ذٝفٖ٦ز⻉ ⟃꣬כؒٝآص،ָ䗳銲ח䘔ׄג⡲䧭 䮋䨌ך6*رؠ؎ׅٝ俑⻉ָזְ
#kansumiB4 ˖ رؠ؎شָ؝٦ت٦חזָ ˖ ر؟؎ٝךך䊨侧ָ⼧ⴓ《 גְזְ ˖ ⢪ְװְׅך⡲הְֲ鋔挿ד ך6*رؠ؎ָٝ遤גֹגְזְ ♶⼧ⴓזرؠ؎ٝ
䮋䨌ך6*رؠ؎ׅٝ俑⻉ָזְ
#kansumiB4 ˖ ٔٔ٦أ䖓ך⥜姻כקהוזְ ˖ ♶Ⱗさֶ㉏ְさׇזוָ֮ה չ㼎Ⳣպׁ ˖ 6*رؠ؎ٝך⥜姻ָ〳腉זךכ 倜堣腉ٔٔ٦أךة؎ىؚٝך 䮋䨌ך6*رؠ؎ׅٝ俑⻉ָזְ
♶⼧ⴓז何㊣
#kansumiB4 فٗآؙؑز鸐׃ג 䮋䨌ך6*رؠ؎ׅٝ俑⻉ָזְ
#kansumiB4 ˖ 劤颵涸דזְ䭷䶯ָ㢳ְ ˖ ⠓陽⚥ח⥜姻ⰻ㺁ָ寸㹀ׁ ˖ 6*رؠ؎ٝךㅷ颵顑⟣罏ך♶㖈 䮋䨌ך6*رؠ؎ׅٝ俑⻉ָזְ ♶⼧ⴓז鐰⣣
#kansumiB4 㠖ך 䮋䨌ךהִ֮׆עאַג
#kansumiB4 ؿٗٝزؒٝس涪 ً؎ٝך➂ְָזְ 䮋䨌ךؿٗٝزؒٝس涪ً؎ٝך➂ְָזְ
#kansumiB4 תדך 714؝ٝزٗ٦ٕػطٕ ؿٗٝزؒٝس涪 䮋䨌ךؿٗٝزؒٝس涪ً؎ٝך➂ְָזְ
#kansumiB4 ˖ ך儗ղדؒٝآص،ָָלג⡲ ˖ 㸣䧭䖓כקרًٝذشٝأך 䮋䨌ךؿٗٝزؒٝس涪ً؎ٝך➂ְָזְ
#kansumiB4 ˖ 濼鋅ָ襳琎ׁחְֻ ˖ 䪮遭ָ刿倜ׁגזְ ˖ ؿٗٝزؒٝسؒٝآص،鋔挿ד أزٖأך֮涪橆㞮 ♶⼧ⴓזظؐعؐ 䮋䨌ךؿٗٝزؒٝس涪ً؎ٝך➂ְָזְ
#kansumiB4 穠卓 䮋䨌ךהִ֮׆עאַג 㠖חעאַזָծװֽװג
#kansumiB4 ˖ ⢪ְװׁׅծהְֲ鋔挿ך㼪Ⰵ ˖ ה״ֻ⳿勻כ׆ 䮋䨌ךהִ֮׆עאַג
#kansumiB4 䮋䨌ך 6*رؠ؎ٝؿٗٝزؒٝس涪何㊣ׅ
#kansumiB4 䮋䨌׃ֿה 䮋䨌ך
#kansumiB4 ˖ ٌتٝז6*رؠ؎ٝ䩛岀ך㼪Ⰵ ˖ ٌتٝזؿٗٝزؒٝس涪橆㞮ך⡲䧭 䮋䨌ך
#kansumiB4 ˖ 6*رؠ؎ׅٝ俑⻉ אֻ 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 ˖ ⽃秪ח䩛岀ٌتٝחֽׅדכ 劤颵涸ז何㊣ָ遤ִזְ ˖ 䩛岀ך何㊣遤ֲחծזך何 ㊣ָ䗳銲זךַծהְֲ椚鍑׃ג ֲ䗳銲ָ֮ 俑⻉ך䗳銲䚍 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 倯ꆙ㔿 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 ⢪ְװְׅ؝ٝزٗ٦ٕػطٕ 䲿⣘ׅך6*رؠ؎ٝ ״״ְ6*رؠ؎ٝךךؿٗ ٝزؒٝس涪 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ رؠ؎ٝה涪ךꟼ⤘䚍
#kansumiB4 6*رؠ؎ٝך䕵ⶴה䗳銲䚍 鏮ִ 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 ˖ ِ٦ؠָ؟٦ؽأⵃ欽ׅꥷח鍗 ך ˖ ؟٦ؽأך⢪ְ䩛ծ⢪ְ䗰㖑 ⡦رؠ؎ٝ׃גְךַ 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 ˖ 6*رؠ؎ٝ׃ַה遤ֲֿהח ״ًٔحز ˖ ➙䖓ךؙٓ؎،ٝز橆㞮ך㢌⻉鋅 䰘ִ6*رؠ؎ٝך䗳銲䚍 וֲ׃ג䗳銲זךַ 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 ˖ 涪ؿٗ٦ך♧橆ה׃ג6*رؠ؎ٝ 穈Ⰵ ˖ 堣腉הずׄ״ֲח⥜姻何㊣遤ֲ וך״ֲחرؠ؎ׁٝץַֹ 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 6*رؠ؎ٝ♳ך椚歋 ד䠐鋅ְֲ 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 ˖ 6*رؠ؎ٝך錁挿ַ䠐鋅ֿׅה ָ֮ծהְֲ钠陎䭯גֲ ˖ 6*رؠ؎ٝ♳ך隁זְه؎ٝزָ֮ ծהְֲ钠陎䭯גֲ 6*رؠ؎ٝך钠濼 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 椚鍑ׁ鐰⣣䭷垥ד 爙ׅ 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 ˖ չرؠ؎ٝ♳ך椚歋պ呎䬿䭯ג 铡僇ׅ ˖ 〳腉זꣲ㹏錁涸זر٦ة欽䠐ׅ 6*رؠ؎ٝך鋔挿ךⰟ剣 䮋䨌ך6*رؠ؎ׅٝ俑⻉אֻ
#kansumiB4 6*رؠ؎ٝ䩛岀ך㼪Ⰵ 䮋䨌ך
#kansumiB4 ˖ ل٦ػ٦فٗزة؎ؾؚٝ ˖ ⹛⡲ٌׅحؙ ˖ ِ٦ؠذأز 䮋䨌ך6*رؠ؎ٝ䩛岀ך㼪Ⰵ
#kansumiB4 ˖ ״傍ְ媮ꥡַ㸣䧭䕎䟝㹀׃ رؠ؎ָٝ⳿勻 ˖ 㹋ꥷך涪ָ㨣תח6*رؠ؎ٝ ♳ך㉏겗ָ涪鋅דֹ ل٦ػ٦فٗزة؎ؾؚٝךⵃ挿 䮋䨌ך6*رؠ؎ٝ䩛岀ך㼪Ⰵ
#kansumiB4 ˖ 㹋鄲ח״㹋騧涸זِ٦ؠذأز 遤ִ ˖ 䟝⫷⸂ח걾זְⰟ剣 ˖ 鐰⣣嗚鎢ָ䗳銲ז皘䨽ך搊挿 כׇֹׁ 䮋䨌ך6*رؠ؎ٝ䩛岀ך㼪Ⰵ
⹛⡲ٌׅحؙך䗳銲䚍
#kansumiB4 ˖ ⢪ְװׁׅ㹏錁涸ח庠 ِ٦ؠذأزך⸬卓 䮋䨌ך6*رؠ؎ٝ䩛岀ך㼪Ⰵ
#kansumiB4 ؿٗٝزؒٝس涪橆㞮ך 剑黝⻉ 䮋䨌ך
#kansumiB4 ˖ 3&45GVMז"1*⚥䗰חծؿٗٝز ؒٝسהغحؙؒٝس毙זꟼ⤘ח ׅ 䮋䨌ךؿٗٝزؒٝس涪橆㞮ך剑黝⻉ 圓䧭ךⴓꨄ
#kansumiB4 ˖ ٗ٦ٕؕךؿٗٝزؒٝس涪橆㞮 ♳ד؟٦غ⹛ַׇ״ֲחׅ ˖ ٗ٦ٕؕ؟٦غ♳ח"1*ٌحؙ⡲ ˖ ְײذأز橆㞮ח籬ָזְד 涪ָדֹ״ֲחׅ "1*ٌحؙ؟٦غ
䮋䨌ךؿٗٝزؒٝس涪橆㞮ך剑黝⻉
#kansumiB4 ˖ غحؙؒٝسך涪罏כ"1*ח꧊⚥ דֹ ˖ "1*ך涪㸣✪䖉׆חؿٗٝز ؒٝس涪鹌 ˖ 6*رؠ؎ٝך何㊣遤ְװְׅ 顑⟣ךⴓ鍑
䮋䨌ךؿٗٝزؒٝس涪橆㞮ך剑黝⻉
#kansumiB4 穠卓 䮋䨌ךؿٗٝزؒٝس涪橆㞮ך剑黝⻉ 俑⻉ךꅕ䧭ծ䩛岀ך何㊣׃
#kansumiB4 ˖ 6*رؠ؎ׅٝ䗳銲䚍ך钠濼 ˖ 涪ؿٗ٦ך♧橆ה׃גך6*رؠ؎ٝ ˖ 6*رؠ؎ٝ䩛岀ך⸬桦⻉ ˖ ؿٗٝزؒٝسغحؙؒٝس倯ך 涪橆㞮ך剑黝⻉
˖ 俑⻉٥䩛岀㼪Ⰵך湱⛦⸬卓 䮋䨌ךؿٗٝزؒٝس涪橆㞮ך何㊣
#kansumiB4 ˖ ״⢪ְװְׅ ؝ٝزٗ٦ٕػطٕך䲿⣘פ ٔٔ٦أתדֲ׃לֶֻ䖉ְֻׁ
#kansumiB4 ַֿך䮋䨌
#kansumiB4 ˖ 䚍腉ך葺ְ؟٦غ䲿⣘ׅ ˖ 䗳銲ז堣腉䲿⣘ׅ ˖ 㸜㹀涸ח麊欽ׅ 傀㶷ך⣣⦼ ַֿך䮋䨌
#kansumiB4 ˖ Ⰻ⡤錁䭯؟٦ؽأرؠ؎ٝ ˖ ״㹋ꥷךِ٦ؠח娄״ 6*رؠ؎ٝ ˖ 竰竲涸ז何㊣ ؿٗٝزַㅷ颵崞ַׅ䮋䨌 ַֿך䮋䨌
#kansumiB4 ِ٦ؠ⚥䗰ח罋ִ ؟٦ؽأך䲿⣘ 湡垥כ ַֿך䮋䨌
#kansumiB4 ׀劍䖉ְֻׁ
More Decks by Satoru Kawahara
See All by Satoru Kawahara
本当に必要ですか?そのステージング環境〜Web制作を Docker でちょっと便利にしよう〜
esukei
1
320
How to publish Sakura icons-set on Cacoo
esukei
1
2.3k
Tries for creating a UXD culture
esukei
1
1.9k
Learning Ember CLI
esukei
4
880
Other Decks in Technology
See All in Technology
AWS基盤改善を支える 私たちの理念と行動指針
kentosuzuki
0
230
Datadog の権限統制 〜Org 統合に向けて調べた注意点 / JDDUG-Meetup_24
visional_engineering_and_design
1
150
マネージャーをエスパーにしない マネジメントされる側から始める、働きやすい現場づくり
comi190327
0
480
複数システムが同居した 15 年物の AWS アカウントを解体するための考古学
wa6sn
3
150
An Introduction to Context Ontology Accelerator (teaching AI agents what your data means)
inariku
PRO
1
270
Steering と Hook (チームの決まりを守らせる) | 目指せ Kiro マスター 06
inariku
PRO
2
130
速くなるほど、深く考える AI時代のQAに学ぶ
kobayashiyorimitsu
0
220
【Oracle AI SPOTLIGHT ウェビナー】【特別開催:日本語で解説!】Oracle AI World 2026 最新情報フィードバック
oracle4engineer
PRO
1
220
少ない人手 限られた予算 それでも守る 消せない・見つける・戻れる オールハザード型BCP on AWS / 20261107 Mitsutoshi Matsuo
shift_evolve
PRO
0
390
プロダクションコードにおける encoding/json から encoding/json/v2 へのスムーズな移行
sansantech
PRO
1
430
SREのためのFinOps入門
muziyoshiz
3
1.6k
閉域網でのAPI公開の選択肢全部比較!
takano0131
2
180
Featured
See All Featured
Unsuck your backbone
ammeep
672
58k
Collaborative Software Design: How to facilitate domain modelling decisions
baasie
1
380
Designing for Timeless Needs
cassininazir
1
560
Applied NLP in the Age of Generative AI
inesmontani
PRO
4
2.6k
How to train your dragon (web standard)
notwaldorf
96
6.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.6k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
28
3.8k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.8k
Practical Orchestrator
shlominoach
192
12k
Git: the NoSQL Database
bkeepers
PRO
433
67k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
62k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
640