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

UIl

Avatar for sjonnet19 sjonnet19
April 17, 2012
Technology
1
81

 UIl

Avatar for sjonnet19

sjonnet19

April 17, 2012
Tweet

More Decks by sjonnet19

See All by sjonnet19
Vagrant
Avatar for sjonnet19 sjonnet19
0
49
Docker
Avatar for sjonnet19 sjonnet19
0
93
Hybrid
Avatar for sjonnet19 sjonnet19
1
54
CSSc
Avatar for sjonnet19 sjonnet19
1
98
MLc
Avatar for sjonnet19 sjonnet19
1
64

Other Decks in Technology

See All in Technology
解析の定理証明実践＠Lean 4
Avatar for H Segawa dec9ue
1
200
250627 関西Ruby会議08 前夜祭 RejectKaigi「DJ on Ruby Ver.0.1」
Avatar for Masaya Kudo msykd
PRO
2
370
LangChain Interrupt & LangChain Ambassadors meetingレポート
Avatar for os1ma os1ma
2
220
5min GuardDuty Extended Threat Detection EKS
Avatar for takakuni takakuni
0
180
Amazon S3標準/ S3 Tables/S3 Express One Zoneを使ったログ分析
Avatar for ShigeruOda shigeruoda
5
590
WordPressから ヘッドレスCMSへ! Storyblokへの移行プロセス
Avatar for Nagisa Yata nyata
0
330
登壇ネタの見つけ方 / How to find talk topics
Avatar for pinkumohikan pinkumohikan
5
590
開発生産性を組織全体の「生産性」へ！ 部門間連携の壁を越える実践的ステップ
Avatar for ussy / @sudo5in5k sudo5in5k
0
350
CursorによるPMO業務の代替 / Automating PMO Tasks with Cursor
Avatar for Motoyoshi Kosei motoyoshi_kakaku
2
790
PHP開発者のためのSOLID原則再入門 #phpcon / PHP Conference Japan 2025
Avatar for shogogg shogogg
4
930
自律的なスケーリング手法FASTにおけるVPoEとしてのアカウンタビリティ / dev-productivity-con-2025
Avatar for Yoshiki Iida yoshikiiida
0
320
2025-06-26 GitHub CopilotとAI駆動開発：実践と導入のリアル
Avatar for 河内崇 fl_kawachi
1
240

Featured

See All Featured
Code Review Best Practice
Avatar for Trisha Gee trishagee
69
18k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
35
2.4k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
524
40k
Understanding Cognitive Biases in Performance Measurement
Avatar for Philip Tellis bluesmoon
29
1.8k
We Have a Design System, Now What?
Avatar for Morgane Peng morganepeng
53
7.7k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
32
1k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.4k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
173
14k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
234
140k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
273
40k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
331
24k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
54
6.4k

Transcript

  1. UIl User Interface Library Shawn Jonnet <[email protected]> Tuesday, April 17,

    12

  2. Overview •Library / Framework •Grid / Layout •UI -Panels /

    Buttons oh my Tuesday, April 17, 12

  3. Library / Framework •Grids / Layouts / Responsive •Structure /

    Organization •OOCSS •Cross browser support •JavaScript Modules Tuesday, April 17, 12

  4. OOCSS Object Oriented CSS •Separate structure and skin •Separate container

    and content •DRY •Predictable •Low specificity Tuesday, April 17, 12

  5. Grid / Layout Responsive layouts •Grids •Layouts •Mobile built in

    Tuesday, April 17, 12

  6. UI Panels / Buttons oh my •Panels / Buttons •Alerts

    / Labels •Tabs •Forms •Tables •more ... Tuesday, April 17, 12

  7. Benefits •Structure / Organization / DRY •Documentation / Branding •Cross

    browser support •Unit testing Tuesday, April 17, 12