体验碎周报第 96 期(2022.5.23)

语言: CN / TW / HK

Opera 浏览器选中非当地货币的价格后,会自动换算成当地货币显示在文字选择菜单中,点击可直接复制当地货币价格到剪贴板中。

京东历史订单提醒囤货

要是以前看到京东历史食品订单提醒我距离上次购买天数和囤货的提醒,我会觉得京东想钱想疯了。现在疫情期间看到京东提醒我囤货,我感到非常温暖。

体验槽点

IT 之家置顶资讯

IT 之家的置顶和其他资讯用灰色分割开,但如果刚好置顶有轮播图又仅有一条置顶资讯的时候,看起来像是一体,会被误解为轮播图是置顶资讯的头图。

推荐阅读

那些你分不清的组件:tab、单选框、菜单

链接: https://mp.weixin.qq.com/s/m3BUtXOmr9F2pwDWL7eMAg

这篇文章首先把 tab、单选框、菜单的来龙去脉讲清楚了,最后针对组件的使用场景发表自己的结论:

  • 不要制造没必要的规矩
  • 对于绝大多数场景比较简单的产品,菜单/单选/tab不区分也无所谓
  • 对于复杂工具型/企业级产品,无论是移动端还是PC/Web,最好区分操作/信息展示控件,严格区分单选和tab的样式。

体验设计师与竞品分析的那些事

链接: https://mp.weixin.qq.com/s/900JRQCzear-pcOfLYOL6A

竞品分析是设计工作中不可或缺的一部分,本文将分享竞品分析的作用与方法,帮助设计师们快速找到优质竞品并快速分析。

为了让自身设计方案能够短时间能更好对标头部产品,在竞品分析过程中一共分为如下三个步骤:

  1. 选竞品:通过使用人群与功能类型选择头部公司的直接竞品与间接竞品;
  2. 分析竞品:运用表格法、打钩法、流程对标法等分析工具进行分析;
  3. 产出结论:如果需要汇报,将怎么选竞品、分析过程完整地进行阐述,然后写出言简意赅的几句核心结论;如果是个人使用,将关键截图与结论放置在设计文档一旁作为记录即可.

Macintosh :38 年之前的故事

链接: https://sspai.com/post/73310

Macintosh 是如今 Mac 系列的鼻祖,乔布斯主导设计的电脑。Macintosh 以其大胆简洁的外观设计,友好的图形界面,在当时轰动业界。这篇文章通过史料拼凑还原出 Macintosh 诞生的传奇过程。

【手把手】教你从 0 到 1 做一个上传菜谱的交互流程与原型设计

链接: https://mp.weixin.qq.com/s/9utWR4PqWdndYyNOA1kknA

一篇非常基础的交互流程与原型设计的文章,值得称道的是每个步骤思路讲得很清楚。

了解这 9 种交互机制,不怕跟开发相爱相杀了

链接: https://mp.weixin.qq.com/s/KDg5ZnioKqLL048ni-J0mQ

本文盘点一些常见的交互机制,包括:删除、中断、显示、加载、排序、刷新、缓存、推送(push)。

Apple 人机界面指南的 36 个见解!

链接: https://mp.weixin.qq.com/s/9pvAXT8pMtqN58aRMfcBLw

Apple 为所有为 Apple 产品设计的设计师制定了指导方针,告诉他们如何做才能使应用程序对任何特定设备或软件更有用,他们称之为人机界面指南。本文总结 iOS、macOS、watchOS 人机指南中核心的 36 个观点。

工具资源

Figma Auto Layout 4.0 Playground (简体中文翻译)

链接: https://www.figma.com/community/file/1107713567093326863

每次 Figma 进行大功能更新都会推出官方 Playground 供大家练习,这次 Auto Layout 4.0 更新非常大,这里有份翻译为中文的 Playground 可用来学习。

Wireframer —— Figma 占位符生成插件

链接: https://www.figma.com/community/plugin/787660853629435276/Wireframer

你可以通过这个插件生成很酷、很独特的 SVG 占位符,放在线框图中。

HMI 体验设计资源汇总

链接: https://nextjs-notion-starter-kit-b5c64eg8p-jackywine.vercel.app/hmi

Figma Tokens —— Figma Design Token 插件

https://www.figma.com/community/plugin/843461159747178978/Figma-Tokens

支持的 Token 包括:

  • 颜色(填充、边框颜色 —— HEX、RGBA、HSLA)
  • 间距(水平、垂直、间隙)
  • 尺寸(宽、高)
  • 圆角(单独或全部)
  • 边框宽度
  • 透明度
  • 字体(Font family、字重、字体大小、行高、行间距、字间距、段间距)
  • 阴影(包括内阴影和外阴影)

《设计领导手册》中文版

链接:链接: https://pan.baidu.com/s/1xuQMt6VSuVqM7vRHToyG7A?pwd=qvcs 提取码: qvcs

InVision 设计教育副总裁 Aarron Walter 和 MailChimp 设计团队创始人 Eli Woolery 编写的手册,这本书将帮助你找到自己作为领导者的定位以及获得自信,同时从那些设计领导力专家那里学习战术方法,这样你就可以支持你的团队,推进你的职业发展。

贝克街的设计师 将这本手册翻译成中文版供大家下载学习。

Side Project 指南

链接: https://sideproject.guide

工作之余,很多程序员喜欢用代码建造一些小工具。有时候是为了解决一些自己或者朋友遇到的小问题,有时候是为了好玩儿。通常称之为 Side Project(业余项目)。这份手册总结如何判断一个点子的好坏,如何快速实现,如何传播,帮助你用 Side Project 成功赚到钱。

产品发现

MagicPip —— 在 iOS 画中画展示其他内容

链接: https://apps.apple.com/app/id1613046504

最近网易云音乐宣布 iOS 版本支持桌面歌词,原理是把歌词做成视频然后利用 iOS 画中画功能,在桌面显示歌词视频。

既然可以把其他文件转换成视频利用画中画在桌面播放,那骚操作就来了。MagicPip 这款工具能把 txt、PDF、图片、网页通过 iOS 画中画显示。

海绵乐队 —— 字节跳动推出的音频剪辑 App

这是一款手机端的便携式音频创作工具,在实现传统的录音、效果器同时,引入大量 AI 智能来协助创作,降低使用难度,提高创作趣味和效率。此产品将更好的服务于汽水音乐和抖音上对音乐编辑有所需求的用户。

acapela —— 工作通知聚合

链接: https://acapela.com

工作中往往需要在不同的软件里查看通知提醒,这样频繁打断注意力很疲劳。这款工具能将 Slack、 Notion、 GitHub、Figma、Jira、Linear 等工作软件的通知聚合在一起,便于统一处理。

泡面盖子 4 Kindle

链接: https://pmgz.jichao.top

Kindle 因为买来经常吃灰,被网友戏称为“只能做泡面盖子”。于是就真有网友做了个适配 Kinde 的泡面倒计时提醒网页。

来自 @蚁工厂

我的第一个 NFT

链接: https://myfirstnft.info

一个公益科普网页,可以在上面学习 Web3、区块链的概念、NFT 的价值和一些安全知识,最后可以铸造了一个免费的 NFT 来当头像。

Liuli —— 一站式构建多源、干净、个性化的阅读环境

链接: https://github.com/liuli-io/liuli

具备四大模块实现自定义阅读环境。

  • 采集器 :监控各自关注的公众号、书籍或者博客源等自定义阅读源,以统一标准格式流入 Liuli 作为输入源;
  • 处理器 :对目标内容进行自定义处理,如基于历史广告数据,利用机器学习实现一个广告分类器自动打标签,或者引入钩子函数在相关节点执行等;
  • 分发器 :依靠接口层进行数据请求&响应,为使用者提供个性化配置,然后根据配置自动进行分发,将干净的文章流向微信、钉钉、TG、RSS 客户端甚至自建网站;
  • 备份器 :将处理后的文章进行备份,如持久化到数据库或者 GitHub 等。

支付宝蚂蚁森林内测「神奇海洋」

支付宝的蚂蚁森林既激励用户使用支付宝,也真的在大西北种树环保,是商业和公益的经典案例。最近支付宝在内测「神奇海洋」,本质和蚂蚁森林一样,只是玩法和环保模式改成培育海域植物 + 清理海域垃圾海洋。

相关资讯

The iOS App Icon Book 已发货

链接: https://www.appiconbook.com/

之前在 Kickstarter 众筹 1400+ 的 The iOS App Icon Book,售价 60 英镑(人民币 400 多元)。150 页,很多经典 icon 都有收录(经过授权和高清文件提供),把早年 iOS 的 icon 设计十年黄金时代,用印刷的方式记录下来。这两天看到 Twitter 上不少收到货晒单的。

来自 @刘英滕

网络剧片发行许可证标志亮相

链接: https://mp.weixin.qq.com/s/aeM2UpHU30VqybWZTphRVw

近年来随着流媒体的迅速发展,网络电影、网络电视剧开始受到观众的追捧。广电总局为网剧制定的发行许可证 LOGO,就像院线电影片头的龙标一样。网剧标的核心部分由篆体字「网络视听」四个字组成。

微软为残疾人设计多款自适应鼠标和按钮

链接: https://news.microsoft.com/ability-summit-2022/

微软在 2022 年 5 月举办微软能力峰会(Microsoft Ability Summit 2022),该峰会旨在加强对包容性技术的关注。微软为此发布了多款适合残疾人使用的自适应鼠标和按钮,这些硬件将于今年秋季开售。