Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Designer X Engineer Development #02

Sponsored · Ship Features Fearlessly Turn features on and off without deploys. Used by thousands of Ruby developers. →
Avatar for tellullu tellullu
December 12, 2018
Design
1.3k
2

Designer X Engineer Development #02

Designer X Engineer Development #02

Avatar for tellullu

tellullu

December 12, 2018

Other Decks in Design

See All in Design
UI/UX & Web Design Portfolio 2025｜Madoka Kumagai
Avatar for Madoka madoka_portfolio
4
250
第18回サイゼミ
Avatar for LW lw
1
3.9k
2026年、デザイナーはなにに賭ける？
Avatar for Kazuhiro Tobita 0b1tk
0
560
デザインとフロントエンドの境界が融ける Claude Code × Figma
Avatar for littlebusters littlebusters
1
2.9k
チームをデザイン対象にする / Design for your team
Avatar for 株式会社カミナシ kaminashi
1
1.5k
Tendências de UX Research 2026
Avatar for Viviane Delvequio videlvequio
0
120
Mandalyn_DT5001_FinalAssignment.pdf
Avatar for Mandalyn Teo lynteo
0
230
体験負債を資産に変える組織的アプローチ
Avatar for hikarutakase hikarutakase
0
1.4k
Storyboard Assignment: Storyboard from Comic Strip
Avatar for Mandalyn Teo lynteo
3
280
「余白」と「欲望」を味方につける ——AI時代のデザインエンジニアリングと「越境」の作法 #KNOTS2026
Avatar for koyaman koyaman
1
1.9k
20260215独立行政法人科学技術振興機構(JST) 社会技術研究開発センター(RISTEX)ケアが根づく社会システム _公開シンポジウム
Avatar for Kimura Atsunobu a2k
1
200
Build for the Web, Build on the Web, Build With the Web
Avatar for Harry Roberts csswizardry
0
430

Featured

See All Featured
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
34k
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
2
390
From π to Pie charts
Avatar for Rasagy Sharma rasagy
0
200
Ten Tips & Tricks for a 🌱 transition
Avatar for Manu Carrasco Molina stuffmc
0
130
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
Avatar for panda_program panda_program
122
22k
The Mindset for Success: Future Career Progression
Avatar for Greg Gifford greggifford
PRO
0
350
Amusing Abliteration
Avatar for ianozsvald ianozsvald
1
200
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
28
3.5k
GraphQLの誤解/rethinking-graphql
Avatar for sonatard sonatard
75
12k
Docker and Python
Avatar for Tania Allard trallard
47
3.9k
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
800
Why Our Code Smells
Avatar for Brandon Keepers bkeepers
PRO
340
58k

Transcript

  1. ΤϯδχΞΛͪΐͬͱ޾ͤʹ͢Δ 6*Ϟʔγϣϯπʔϧ %FTJHOFS9&OHJOFFS%FWFMPQNFOU ΉΒ͔Έɻ ):(&*OUFSGBDF6*ϞʔγϣϯσβΠφʔ 

  2. ͸͡Ίʹ ΉΒ͔Έɻ ࣗݾ঺հ ɾ೥ΑΓ):(&*OUFSGBDFۈ຿ ɾژ౎ͷඒେͰϞʔγϣϯάϥϑΟοΫε ɹΛத৺ͱͨ͠ө૾੍࡞ΛֶͿ ɾࣾ಺ॳɺ།Ұͷ6*ϞʔγϣϯσβΠφʔ
 ɹͱͯ͠ೖࣾ ɾ6*Ϟʔγϣϯɺͦͷଞө૾੍࡞શൠΛ୲౰ ɾ࠷ۙͰ͸%ϓϦϯλʔΛ࢖ͬͨϋʔυ΢ΣΞ

    ɹσβΠϯʹ΋ܞΘΔ

  3. 6*ϞʔγϣϯσβΠφʔͱ͸ 8FCσβΠφʔ ΤϯδχΞ 6*ϞʔγϣϯσβΠφʔ σβΠϯσʔλ΋Β͏ σβΠϯʹಈ͖Λ͚ͭΔ ө૾ΛΤϯδχΞ΁ NPW NQ HJG

    FUD ࣮૷ ΫϥΠΞϯτ

  4. ঺հ͢Δπʔϧ ✕

  5. ମݧஊ ͋Δ೔ͷग़དྷࣄ

  6. ମݧஊ ΤϯδχΞ"͞Μ ΉΒ͔Έɻ σβΠϯʹಈ͖Λ͚ͭΔ ө૾ΛΤϯδχΞ΁ NPW NQ HJG FUD

  7. ମݧஊ ΤϯδχΞ"͞Μ ΉΒ͔Έɻ σβΠϯʹಈ͖Λ͚ͭΔ ө૾ΛΤϯδχΞ΁ NPW NQ HJG FUD DVCJDCF[JFSΑͤ͜Χε

    

  8. $VCJDCF[JFSͱ͸ cubic-bezier(.6,0,.4,1) ɾಈ͖ͷ଎͞Λࢦఆ͢Δ਺஋
 ɹ Πʔδϯάͱ΋ݴ͏ ɾ਺஋͕͋Ε͹࣮૷޻਺ΛݮΒ͢͜ͱ͕ग़དྷΔ DVCJDCF[JFS ɾ͜ͷ਺஋Ͱಈ͖ͷؾ࣋ͪΑ͞ɺϢʔβϏϦςΟ ɹ͕มΘͬͯ͘ΔͷͰॏཁͳ෦෼

  9. $VCJDCF[JFSͱ͸ cubic-bezier(.6,0,.4,1) ɾಈ͖ͷ଎͞Λࢦఆ͢Δ਺஋
 ɹ Πʔδϯάͱ΋ݴ͏ ɾ਺஋͕͋Ε͹࣮૷޻਺ΛݮΒ͢͜ͱ͕ग़དྷΔ DVCJDCF[JFS ɾ͜ͷ਺஋Ͱಈ͖ͷؾ࣋ͪΑ͞ɺϢʔβϏϦςΟ ɹ͕มΘͬͯ͘ΔͷͰॏཁͳ෦෼ ͜ͷ਺஋͕Θ͔Ε͹࣮૷͠΍͘͢ͳΔʂ

  10. πʔϧಋೖલ ΤϯδχΞ ө૾ 8FC ࣮૷ ݟͯ࠶ݱ ө૾Λݟͯࢼߦࡨޡ͢Δ͔͠ͳ͔ͬͨ

  11. πʔϧಋೖޙ ΤϯδχΞ ө૾ 8FC ࣮૷ ݟͯ࠶ݱ ಈ͖ͷ஋ DVCJDCF[JFS

  12. πʔϧಋೖʹΑΔޮՌ ΤϯδχΞ ө૾ 8FC ࣮૷ ݟͯ࠶ݱ lಈ͖zͷ࣮૷͕ͪΐͬͱָʹͳΔ ಈ͖ͷ஋ DVCJDCF[JFS

  13. ղܾࡦ ਺஋ΛऔಘͰ͖ΔπʔϧΛ࢖͏

  14. ঺հ͢Δπʔϧ ✕

  15. 6*Ϟʔγϣϯ੍࡞ ɾBEPCF੡ө૾੍࡞ιϑτ ɾөըΞχϝ$.શͯͷۀքͷඪ४ ɾΨνΕ͹ϋϦ΢ουڃͷө૾΋࡞ΕΔ "GUFS&⒎FDUT ɾ΋ͱ΋ͱ8FC੍࡞޲͚Ͱ͸ͳ͍ͷͰɺ
 ɹෆศͳ෦෼͋Γ

  16. 6*Ϟʔγϣϯ੍࡞ ɾBEPCF੡ө૾੍࡞ιϑτ ɾөըΞχϝ$.શͯͷۀքͷඪ४ ɾΨνΕ͹ϋϦ΢ουڃͷө૾΋࡞ΕΔ "GUFS&⒎FDUT ɾ΋ͱ΋ͱ8FC੍࡞޲͚Ͱ͸ͳ͍ͷͰɺ
 ɹෆศͳ෦෼͋Γ ͜Ε͚ͩͰ͸DVCJDCF[JFSͷ਺஋Λ஌Δػೳ͕ͳ͍ʜ

  17. πʔϧ঺հ ɾ"GUFS&⒎FDUTઐ༻ϓϥάΠϯ ɾΠʔδϯάิॿπʔϧ ɾΠʔδϯάͷ஋ DVCJDCF[JFS ΛऔಘͰ͖Δ 'MPX cubic-bezier(.6,0,.4,1)

  18. πʔϧ঺հ

  19. ಋೖޙͷମݧஊ ΤϯδχΞ"͞Μ ΉΒ͔Έɻ ө૾ DVCJDCF[JFS

  20. ಋೖޙͷମݧஊ ΤϯδχΞ"͞Μ ΍Δ͡ΌΜ ө૾ DVCJDCF[JFS ΉΒ͔Έɻ

  21. ಋೖͷϝϦοτ ϝϦοτ ɾಈ͖ͷ࠶ݱੑ্͕͕Δ ɾ࣮૷޻਺୹ॖ ɹˠ਺஋͕͋ΔͨΊݕূ࣌ؒ୹ॖ

  22. ಋೖͷϝϦοτ ɾಈ͖ͷ࠶ݱੑ্͕͕Δ ɾ࣮૷޻਺୹ॖ ɹˠ਺஋͕͋ΔͨΊݕূ࣌ؒ୹ॖ ˠΤϯδχΞ͞Μʹت͹ΕΔ ˠྑ͍ϞʔγϣϯΛ࣮૷Ͱ͖Δ ϝϦοτ ˠΫϥΠΞϯτʹت͹ΕΔ ˠΈΜͳϋοϐʔ

  23. ·ͱΊ ✕ Λ࢖ͬͯΤϯδχΞΛ޾ͤʹ͠Α͏ʂ

  24. 6*Ϟʔγϣϯ෍ڭ ΈΜͳ ͜ΕΛػʹ6*Ϟʔγϣϯɺ΍Ζ͏

  25. 6*Ϟʔγϣϯ෍ڭ ˡ6*Ϟʔγϣϯͷهࣄॻ͍ͯ·͢

  26. એ఻ ϋΠδɾΠϯλʔϑΣΠεͰ͸ɺ σΟϨΫλʔσβΠφʔΤϯδχΞ Λืू͍ͯ͠·͢ʂ

  27. ͓ΘΓ ͋Γ͕ͱ͏͍͟͝·ͨ͠ɻ ˡΉΒ͔ΈɻOPUF ˡ):(&*OUFSGBDF8FC4JUF ΉΒ͔Έɻ ):(&*OUFSGBDF6*ϞʔγϣϯσβΠφʔ