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

把握UI设计趋势

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest. →
Avatar for cssrain cssrain
July 14, 2014
Technology
1
100

 把握UI设计趋势

Avatar for cssrain

cssrain

July 14, 2014
Tweet

More Decks by cssrain

See All by cssrain
UED工作流程分享和交流
Avatar for cssrain cssrain
1
450
解读HTML
Avatar for cssrain cssrain
0
130
解读HTML5
Avatar for cssrain cssrain
2
160
基础CSS（1）
Avatar for cssrain cssrain
0
150
基础CSS（2）
Avatar for cssrain cssrain
0
100
高效的CSS
Avatar for cssrain cssrain
0
150
高级CSS—继承
Avatar for cssrain cssrain
0
120
PhoneGap分享和交流
Avatar for cssrain cssrain
0
90
PhoneGap实践
Avatar for cssrain cssrain
0
72

Other Decks in Technology

See All in Technology
システム標準化PMOから ガバメントクラウドCoEへ
Avatar for 高橋広和 techniczna
1
140
Go標準パッケージのI/O処理をながめる
Avatar for matumoto matumoto
0
230
決済サービスを支えるElastic Cloud - Elastic Cloudの導入と推進、決済サービスのObservability
Avatar for suzukij suzukij
2
660
Tebiki Engineering Team Deck
Avatar for Tebiki, Inc. tebiki
0
27k
僕、S3 　シンプルって名前だけど全然シンプルじゃありません　よろしくお願いします
Avatar for Yuuki Yamashita yama3133
1
230
Yahoo!ショッピングのレコメンデーション・システムにおけるML実践の一例 
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
230
It’s “Time” to use Temporal
Avatar for Saji sajikix
3
220
Claude Code Skills 勉強会 (DevelersIO向けに調整済み) / claude code skills for devio
Avatar for MasahiroKawahara masahirokawahara
1
22k
20260311 ビジネスSWG活動報告（デジタルアイデンティティ人材育成推進WG Ph2 活動報告会）
Avatar for OpenID Foundation Japan oidfj
0
350
身体を持ったパーソナルAIエージェントの 可能性を探る開発
Avatar for yoko / Naoki Yokomachi yokomachi
1
130
夢の無限スパゲッティ製造機 #phperkaigi
Avatar for hideki kinjyo o0h
PRO
0
160
猫でもわかるKiro CLI(AI 駆動開発への道編)
Avatar for Hiroo Katoh kentapapa
0
260

Featured

See All Featured
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
210
24k
ラッコキーワード サービス紹介資料
Avatar for ラッコ株式会社 rakko
1
2.7M
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
128
55k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
Avatar for Aleyda Solis aleyda
1
1.9k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.2k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
Avatar for Sam Stephenson sstephenson
162
16k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
10
1.1k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
1.8k

Transcript

  1. UI设计小组分享 1 Go 烹饪高端视觉盛宴 ——把握UI设计趋势 UI设计小组分享① By: Li Yali 2014/04

  2. Q: 现今UI的 设计趋势 是什么？ 什么是In？ 什么是Out？ 啥？我的设计过气啦?? 为啥 有些网站简简单单， 可就那么顺眼呢？

  3. 看看这些设计，你有什么感受？

  4. None
  5. None
  6. None

  7. Boring… & Out！ Not bad，but… 拟物 仿真 高光 阴影 纹理

  8. 现在的网站都有一种趋势: 过度 修饰 极简 No Yes

  9. None
  10. None
  11. None
  12. None

  13. 去 除 干 扰 让 信 息 自 身 说

    话

  14. 引领设计趋势的网页作品 那些高大上的设计…

  15. Themes Kingdom http://www.themeskingdom.com

  16. None

  17. MOVING THINGS DESIGN http://wearemovingthings.com

  18. None

  19. THE SECRET HANDSHAKE http://learnthesecrethandshake.com

  20. None

  21. STEREO CREATIVE http://stereocreative.com

  22. None

  23. Nearly Impossible http://stereocreative.com

  24. None

  25. ADAM RUDZKI http://adamrudzki.com

  26. None

  27. TEAMGEEK http://www.teamgeek.co.za

  28. None

  29. 响应式 极简 配色 垂直 滚动 复古 配色 基于 网格 扁平化

    巨大 色块 黑白 配色 长阴影 大视野 视图 大字体 大量 纯色

  30. 拟物设计并非完全出局 拟物化与扁平化各有优点，将来更倾向于两者相结合。 友情提示 扁平化 ≠ 界面被设计成扁的平的 扁平化是一种让设计者在界面设计过程中减少信息层级的内在设计思想。

  31. * 多边形风格设计

  32. 2014年移动界面设计新趋势?

  33. 唯一主色调 Simple color schemes

  34. 多彩色 Hypercolour

  35. 数据可视化 Data Visualization

  36. 卡片化 Cards

  37. 内容为王 Content First

  38. 圆形的运用 Circle Design

  39. 大视野背景图 Bigger Vision image background

  40. 磨砂玻璃效果 Frosted surface

  41. 链接汇总，供君参考 http://www.themeskingdom.com/ http://wearemovingthings.com/ http://learnthesecrethandshake.com/ http://stereocreative.com/ http://www.teamgeek.co.za/#awards http://adamrudzki.com/ http://nearlyimpossible.org/ http://yosoygil.com/ http://letters-inc.jp/

  42. 李雅丽 UI Designer @UED Team * 演讲中所引用的素材来自网络