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

The Tricothomy of UI Development

Avatar for Andrei Pfeiffer Andrei Pfeiffer
November 27, 2019
Programming
0
160

The Tricothomy of UI Development

Avatar for Andrei Pfeiffer

Andrei Pfeiffer

November 27, 2019
Tweet

More Decks by Andrei Pfeiffer

See All by Andrei Pfeiffer
How Full is your Stack?
Avatar for Andrei Pfeiffer andreipfeiffer
2
47
A Vue over React
Avatar for Andrei Pfeiffer andreipfeiffer
6
1k
Testing Layers - ngBigParty
Avatar for Andrei Pfeiffer andreipfeiffer
0
74
Automatizarea proceselor cu Grunt
Avatar for Andrei Pfeiffer andreipfeiffer
0
130

Other Decks in Programming

See All in Programming
Javaに鉄道指向プログラミング (Railway Oriented Pro　gramming) のエッセンスを取り入れる/Bringing the Essence of Railway-Oriented Programming to Java
Avatar for takumi.okamoto cocet33000
2
550
The Evolution of Enterprise Java with Jakarta EE 11 and Beyond
Avatar for ivargrimstad ivargrimstad
1
670
Benchmark
Avatar for 송상윤 sysong
0
180
プロダクト開発でも使おう 関数のオーバーロード
Avatar for yoiwamoto yoiwamoto
0
150
Elixir で IoT 開発、 Nerves なら簡単にできる！？
Avatar for pojiro pojiro
1
130
Datadog RUM 本番導入までの道
Avatar for Shintaro Matsumoto shinter61
1
270
Using AI Tools Around Software Development
Avatar for inouehi inouehi
0
1.2k
Cline指示通りに動かない？ AI小説エージェントで学ぶ指示書の書き方と自動アップデートの仕組み
Avatar for 葦沢かもめ kamomeashizawa
1
480
FormFlow - Build Stunning Multistep Forms
Avatar for Yonel Ceruto González yceruto
1
160
Javaのルールをねじ曲げろ！禁断の操作とその代償から学ぶメタプログラミング入門 / A Guide to Metaprogramming: Lessons from Forbidden Techniques and Their Price
Avatar for nrs nrslib
3
1.9k
社内での開発コミュニティ活動とモジュラーモノリス標準化事例のご紹介/xPalette and Introduction of Modular monolith standardization
Avatar for Mitsuharu Maruyama m4maruyama
1
120
XSLTで作るBrainfuck処理系
Avatar for MakKi makki_d
0
200

Featured

See All Featured
Building Applications with DynamoDB
Avatar for Matt Wood mza
95
6.4k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
35
6.7k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
276
23k
Bootstrapping a Software Product
Avatar for Garrett Dimon garrettdimon
PRO
307
110k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
159
23k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
32
5.9k
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
77
5.8k
Fireside Chat
Avatar for paigeccino paigeccino
37
3.5k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
43
2.4k
Faster Mobile Websites
Avatar for Dean Hume deanohume
307
31k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
39
1.8k
Scaling GitHub
Avatar for Zach Holman holman
459
140k

Transcript

  1. THE TRICOTHOMY OF UI DEVELOPMENT

  2. UI

  3. USER INTERFACE

  4. INTERFACE

  5. The shared boundary between 2 components of a system that

    allows them to exchange information
  6. None
  7. None
  8. None

  9. THINKING LIKE A FRONT-END DEVELOPER CHRIS COYIER

  10. DESIGN, CSS/SVG UX, A11Y FRAMEWORKS, BUNDLERS CSS-IN-JS, ARCHITECTURE

  11. None

  12. ANDREI PFEIFFER CODE DESIGNER EVENT ORGANIZER TECHNICAL WRITER

  13. None
  14. None
  15. None

  16. FRONT-END BACK-END PUBLIC ACCESS CLIENT FACING LIMITED ACCESS BACK OFFICE

  17. CLIENT FACING BACK OFFICE

  18. CLIENT FACING vs. BACK OFFICE

  19. BACK OFFICE LAYOUT

  20. CLIENT FACING LAYOUTS

  21. NAVIGATION

  22. TABLES

  23. FORMS

  24. by Alejandro Ausejo

  25. by Olia Gozha

  26. by Peter Deltondo by Anna Wangler

  27. IMAGES

  28. TYPOGRAPHY

  29. ANIMATIONS

  30. CROSS BROWSER

  31. SEO a11y i18n

  32. WEBSITE APP

  33. WEBSITE vs. APP

  34. STATE / DATA MANAGEMENT

  35. None

  36. DESIGN PATTERNS

  37. FRAMEWORKS

  38. None
  39. None

  40. (AUTOMATED) TESTS

  41. COMPONENTS LIBRARY

  42. FEW LAYOUT AESTHETICS ACCESSIBILITY DEVICE SUPPORT SOFTWARE COMPLEXITY CLIENT FACING

    WEBSITE BACK OFFICE APP COMPLEX SIMPLE HIGH LOW HIGH LOW HIGH LOW LOW HIGH INTERACTIVITY AUTOMATED TESTS LOW HIGH MANY NO COMPONENTS LIBRARY YES

  43. CLIENT FACING APP BACK OFFICE WEBSITE

  44. CLIENT FACING APP BACK OFFICE WEBSITE

  45. CLIENT FACING WEBSITE

  46. APP BACK OFFICE

  47. WEBSITE BACK OFFICE

  48. CLIENT FACING APP

  49. CLIENT FACING APP

  50. by Darin Senneff

  51. BACK OFFICE APP CLIENT FACING WEBSITE MANY CLIENT FACING APP

    COMPLEX HIGH COMPLEX HIGH HIGH HIGH CUSTOM FEW COMPLEX HIGH HIGH HIGH LOW LOW NO SIMPLE LOW LOW LOW HIGH HIGH MANY YES LAYOUT AESTHETICS ACCESSIBILITY DEVICE SUPPORT SOFTWARE COMPLEXITY INTERACTIVITY AUTOMATED TESTS COMPONENTS LIBRARY

  52. CLIENT FACING WEBSITE BACK OFFICE APP CLIENT FACING APP

  53. CLIENT FACING APP ACCOUNTING ISSUE TRACKER CHAT

  54. ACCOUNTING ISSUE TRACKER CHAT USER COUNT / DIVERSITY

  55. CONCLUSIONS

  56. REUSABILITY CUSTOMIZATION CLIENT-FACING APPS

  57. CLIENT-FACING APPS AND REUSABILITY CUSTOMIZATION

  58. REUSABILITY CUSTOMIZATION

  59. None
  60. None

  61. /andreipfeiffer @pfeiffer_andrei /@andrei.pfeiffer THANK YOU