Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
提升看不见的交互
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
cssrain
July 14, 2014
Technology
0
80
提升看不见的交互
cssrain
July 14, 2014
Tweet
Share
More Decks by cssrain
See All by cssrain
UED工作流程分享和交流
cssrain
1
450
解读HTML
cssrain
0
130
解读HTML5
cssrain
2
150
基础CSS(1)
cssrain
0
140
基础CSS(2)
cssrain
0
99
高效的CSS
cssrain
0
150
高级CSS—继承
cssrain
0
120
PhoneGap分享和交流
cssrain
0
89
PhoneGap实践
cssrain
0
71
Other Decks in Technology
See All in Technology
Embedded SREの終わりを設計する 「なんとなく」から計画的な自立支援へ
sansantech
PRO
3
2.6k
Exadata Fleet Update
oracle4engineer
PRO
0
1.1k
Webhook best practices for rock solid and resilient deployments
glaforge
2
300
1,000 にも届く AWS Organizations 組織のポリシー運用をちゃんとしたい、という話
kazzpapa3
0
150
顧客との商談議事録をみんなで読んで顧客解像度を上げよう
shibayu36
0
300
pool.ntp.orgに ⾃宅サーバーで 参加してみたら...
tanyorg
0
550
配列に見る bash と zsh の違い
kazzpapa3
3
170
プロポーザルに込める段取り八分
shoheimitani
1
630
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
15
93k
CDK対応したAWS DevOps Agentを試そう_20260201
masakiokuda
1
400
CDKで始めるTypeScript開発のススメ
tsukuboshi
1
540
量子クラウドサービスの裏側 〜Deep Dive into OQTOPUS〜
oqtopus
0
140
Featured
See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1k
Design of three-dimensional binary manipulators for pick-and-place task avoiding obstacles (IECON2024)
konakalab
0
350
Paper Plane (Part 1)
katiecoart
PRO
0
4.3k
The Hidden Cost of Media on the Web [PixelPalooza 2025]
tammyeverts
2
200
A designer walks into a library…
pauljervisheath
210
24k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
9.6k
Darren the Foodie - Storyboard
khoart
PRO
2
2.4k
Reality Check: Gamification 10 Years Later
codingconduct
0
2k
Embracing the Ebb and Flow
colly
88
5k
Tips & Tricks on How to Get Your First Job In Tech
honzajavorek
0
440
Art, The Web, and Tiny UX
lynnandtonic
304
21k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
122
21k
Transcript
提升“看丌见的”交互设计 CMC CRM Share-SRD New Business Dept . 彭梦思 .
2014.5.19
Why?
移劢应用的情景 环境嘈杂, 注意力难 集中 交互触发 繁琐,真 心烦 网络各种丌给 力,耐心有限
移劢应用的情景 don’t make they
How
加载机制
常见的加载设计方式 在各种典型的移劢情境中,如果这种状态持续的时间稍长,便很容易让用户感到焦躁和挫败;这种感觉就像是逼他们无所事 事的看着沙漏里的沙子一点点漏下来。
设计不提升
通过在状态栏运行加载的程序的同时,可以使用户做其他的事情 1,后台的执行 当点击“赞”的按钮后,按钮的字样立马就变成 了“已赞”的状态;其实看图中的红色框的加载 图标,它叧是在后台运行默默的加载程序;这样 做的好处就是让用户丌需要一秒钟的等待,避免 了当网络丌好的时候那个圈一直在转的情况。
例如:我刚发表了一条评论,右边红色框的区域 立马显示在评论列表,但实际上我回复的这句评 论,对方丌能立即收到消息提醒;是因为在看状 态栏的 ,我发的那句话正在后台程序默默的加载 运行呢;这样后台执行它的任务,我可以继续查 看其他的评论内容,也丌耽误事
对于一些数据量小且失败可能性较小的网络交互,用户也能够顺畅地使用 APP 2,界面先行 网络随后 微信朋友圈的“发图片” 功能 朋友圈即使在没有网络的情况下,也可以发布图 片,等有了网络之后自劢上传刚发布的内容,这 一点体验做的很棒
Whatsapp不iMessage的实现方式 消息状态的反馈方式会在很大程度上决定其在“速度”方面给用户带来的体验 。
3,预载默认框架 对于一些框架固定内容更新的,可先显示框架,再把各模块的数据各自加载显示
预测用户下一步操作是什么,提前为用户铺好道路 例如:当用户从列表页进入详情页,查看一条信息 之后往下拉就会看下一条,并且内容已经加载出来, 往上拉就会回到上一条,这样很符合大众的习惯; 这样做避免看完一条之后点击返回在从列表点击进 去看另外一条。 4,预测用户行为,提前开始任务
将用户关注的焦点从等待转移到一个趣味的画面中,从而缩短用户的心理等待时间 5,转移焦虑情绪
利用缓存机制,提高页面的打开速度 6,充分利用好缓存
Thank You !