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

Smarter UI Development

Avatar for Konstantin Konstantin
October 03, 2018
Technology
0
53

Smarter UI Development

In this short presentation, we explore how we can build UI "the smart way" using StoryBook.

Avatar for Konstantin

Konstantin

October 03, 2018
Tweet

More Decks by Konstantin

See All by Konstantin
Global state management
Avatar for Konstantin konstantin_lebedev
0
29
Rematch - Redux with superpowers
Avatar for Konstantin konstantin_lebedev
0
120
Headless CMS
Avatar for Konstantin konstantin_lebedev
0
63

Other Decks in Technology

See All in Technology
こんなところでも（地味に）活躍するImage Modeさんを知ってるかい？- Image Mode for OpenShift -
Avatar for Masataka Tsukamoto tsukaman
0
140
10Xにおける品質保証活動の全体像と改善 #no_more_wait_for_test
Avatar for nihonbuson nihonbuson
PRO
2
240
CDK対応したAWS DevOps Agentを試そう_20260201
Avatar for モブエンジニア（Masaki Okuda） masakiokuda
1
270
Ruby版 JSXのRuxが気になる
Avatar for SansanTech sansantech
PRO
0
150
レガシー共有バッチ基盤への挑戦 - SREドリブンなリアーキテクチャリングの取り組み
Avatar for Konishi tatsuhiro tatsukoni
0
210
Introduction to Sansan, inc / Sansan Global Development Center, Inc.
Avatar for Sansan, Inc. sansan33
PRO
0
3k
Amazon S3 Vectorsを使って資格勉強用AIエージェントを構築してみた
Avatar for usanchuu usanchuu
3
450
量子クラウドサービスの裏側　〜Deep Dive into OQTOPUS〜
Avatar for OQTOPUS oqtopus
0
110
ブロックテーマ、WordPress でウェブサイトをつくるということ / 2026.02.07 Gifu WordPress Meetup
Avatar for Toro_Unit (Hiroshi Urabe) torounit
0
180
生成AIを活用した音声文字起こしシステムの2つの構築パターンについて
Avatar for Kazuki Miura miu_crescent
PRO
2
200
Amazon Bedrock Knowledge Basesチャンキング解説！
Avatar for 野口碧生 aoinoguchi
0
140
AI駆動開発を事業のコアに置く
Avatar for 鬼澤輔 tasukuonizawa
1
180

Featured

See All Featured
It's Worth the Effort
Avatar for 3n 3n
188
29k
Kristin Tynski - Automating Marketing Tasks With AI
Avatar for Tech SEO Connect techseoconnect
PRO
0
140
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
Avatar for Sophie Logan marketingsoph
0
74
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
Mozcon NYC 2025: Stop Losing SEO Traffic
Avatar for Sam Torres samtorres
0
140
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.2k
Self-Hosted WebAssembly Runtime for Runtime-Neutral Checkpoint/Restore in Edge–Cloud Continuum
Avatar for Yuki Nakata chikuwait chikuwait
0
320
Writing Fast Ruby
Avatar for Erik Berlin sferik
630
62k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
54k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.7k
Making the Leap to Tech Lead
Avatar for Ryan Cromwell cromwellryan
135
9.7k
The Curious Case for Waylosing
Avatar for Cassini Nazir cassininazir
0
240

Transcript

  1. SMARTER UI DEVELOPMENT Konstantin Lebedev

  2. WEATHER APP

  3. WEATHER APP

  4. WEATHER APP

  5. WEATHER APP

  6. How can we test multiple visual states of a component?

    PROBLEM #1

  7. TRAVEL APP ONBOARDING

  8. TRAVEL APP ONBOARDING

  9. TRAVEL APP ONBOARDING

  10. TRAVEL APP ONBOARDING

  11. How can we test visual states of a component that

    isn’t always visible on the screen? PROBLEM #2

  12. STORYBOOK

  13. Storybook - isolated environment to quickly develop and design UI

    components STORYBOOK

  14. STORYBOOK

  15. STORYBOOK

  16. WRITING STORIES

  17. STORYBOOK

  18. STORYBOOK

  19. STORYBOOK

  20. STORY SHOTS

  21. STORY-SHOTS

  22. WITH STORYBOOK • test components in isolation • test multiple

    visual states • live documentation for our UI

  23. THANK YOU Konstantin Lebedev / @koss_lebedev