2.4.6 Design System - Carousel

学习曲线这件事
有时候,起步的阶段最累最难

Carousel 轮播器其实也是各种专案常遇到的元件
不过在搜集资料过程有看到,在数据统计结果轮播器只有第一张会有较高互动性(点击),以自身经验来看好像也是,毕竟现代的人接收新资讯的速度太快、对於很多事物的专注程度与耐心并不高

也有看到一些文章认为 Instagram 的跑马灯轮播方式是趋势,但我作为用户其实很不喜欢,因为虽然触碰萤幕可以停在某个画面,但不是每次都管用(可能手机太不给力XD)

但我认为在设计上可以注意几点

  1. 之前讲过人的短期记忆在7正负2,所以会建议要轮播的话,显示资讯数量不要太多
  2. 让用户自行切换内容,曾有客户反映过自动轮播很干扰网站体验、加上 N/Ng 也有建议轮播要让用户在可控范围检视内容
    (参考:Carousel Usability)
  3. 用点点、箭头、分段横线或缩图窗格,不管哪种形式都要让用户明显可以看到控件,有些网站的点点或箭头很常被图片吃掉
  4. 在手机上,操作手势要注意不能跟其他功能有冲突,ex: iOS 左右滑动 回上/下一页

跟第 1 点很雷同的是,N/Ng 有提到要在 3-4 个步骤让用户可以看到所有资讯并举 Netflix 的手机版 App 显示方式不是很建议,但我认为虽然要很多步骤才能看完所有影片项目,但这就跟真实世界大家喜欢拿着遥控器转来转去的感觉一样,并没有不好XD~所以还是要看产品本身&用户习惯


实务经验上的小故事

有时候客户也不清楚产品具体的样貌,可能会给你很抽象的描述、要你生出点什麽来
这时候我们能做的就只有先生出点什麽来,客户会告诉你他不要什麽,再慢慢把他的想像具体化

最近跟一群工程师合作,总觉得他们比我辛苦很多,但又不能对产品的样貌妥协,这时候就会觉得
「现在我加诸在他们身上的要求,如果真的哪天想转职工程师,那些罪恶都会回来在我身上的啊!」
想到这就觉得不能随便入坑XD

各位 IT 人们辛苦了!

Day 15 End
(终於走到一半了,写文章也是不能随便入坑的)


<<:  [Day15] TS:在 Mapped Type 中使用 Template Literal 来改物件型别中的所有 key

>>:  【在厨房想30天的演算法】Day 15 演算法 : 排序 sort II 堆积、合并、快速

Day 19 -HAVING 子句!

HAVING 子句是用来取代 WHERE 搭配聚合函数 (aggregate function) 进...

[Day 29] Frontend ? Backend ? 如何做选择?

可能很多人一开始看到系列文主题就会产生疑惑了:「前後端都碰会不会都不专精啊?」 其实这个问题的答案我...

Day 29 AWS云端服务启用一条龙抓起来-CloudFormation

想要更便捷的来开启云端服务吗?CloudFormation帮我们搞定! 1. CloudFormat...

Day27-TypeScript(TS)的命名空间(Namespace)与模组(Modules)

今天要来带大家认识一下TypeScript(TS)的命名空间(Namespace)与模组(Modul...

【Day 19】Shellcode 与他的快乐夥伴 (下) - Shellcode Loader

环境 Windows 10 21H1 Visual Studio 2019 前情提要 在上一篇【Da...