Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
提升看不见的交互
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
cssrain
July 14, 2014
Technology
120
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
提升看不见的交互
cssrain
July 14, 2014
More Decks by cssrain
See All by cssrain
UED工作流程分享和交流
cssrain
1
540
解读HTML
cssrain
0
210
解读HTML5
cssrain
2
230
基础CSS(1)
cssrain
0
220
基础CSS(2)
cssrain
0
160
高效的CSS
cssrain
0
210
高级CSS—继承
cssrain
0
190
PhoneGap分享和交流
cssrain
0
160
PhoneGap实践
cssrain
0
110
Other Decks in Technology
See All in Technology
Deep Data Security 機能解説
oracle4engineer
PRO
2
800
子育てエンジニアの可処分時間が減っても成長を諦めない戦い方
sudoakiy
6
4.5k
自作バイナリを動かす「入口」8選
puhitaku
2
1.3k
自主式軟體工廠
philipz
0
260
無理せず続ける、子育てエンジニアの学び
codmoninc
PRO
0
720
PagerDuty Tech Hub-鳴らすけれど、人は動かない
ezaki
0
130
Loop Engineering これくらいでいい
mikanichinose
0
230
AIがコードを書く時代に、エンジニアは何で自分の価値を証明するのか / In an era where AI writes code how do engineers prove their value
carta_engineering
3
930
AI駆動開発の時代になったのでトヨタ生産方式から見直す
terurou
7
5.9k
Essential architectural thinking (revised edition)
ufried
0
120
自分で立ててみるLLMサービス
y_sera15
0
160
二歩目のフロントエンド・ウェブアクセシビリティ
camiha
2
440
Featured
See All Featured
Between Models and Reality
mayunak
4
490
Bash Introduction
62gerente
615
220k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
600
Deep Space Network (abreviated)
tonyrice
0
370
HDC tutorial
michielstock
2
960
We Are The Robots
honzajavorek
0
400
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
3
3.9k
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
460
Avoiding the “Bad Training, Faster” Trap in the Age of AI
tmiket
0
270
Navigating Algorithm Shifts & AI Overviews - #SMXNext
aleyda
1
1.7k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
11
1.1k
The untapped power of vector embeddings
frankvandijk
2
1.9k
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 !