# 小气的神 ## Posts - [《IXDC2025AI峰会R1-设计价值重心迁移与科学幻想叙事》](https://mdong.org/2025/11/%e3%80%8aixdc2025ai%e5%b3%b0%e4%bc%9ar1-%e8%ae%be%e8%ae%a1%e4%bb%b7%e5%80%bc%e9%87%8d%e5%bf%83%e8%bf%81%e7%a7%bb%e4%b8%8e%e7%a7%91%e5%ad%a6%e5%b9%bb%e6%83%b3%e5%8f%99%e4%ba%8b%e3%80%8b/): 官方快报IXDC2025人工智能峰会|全球顶尖科技企业共探AI重塑创造力与商业新生态 嗯,其实当下所在发生的大部分设计工作与业务形态,在未来可能都不重要,但维系这个组织/生态与社会产生连接本身即是大部分时候可理解的价值。但这个并不能构成个体在一个组织的长期竞争力,虽然会被阶段性奖励。我们所观察的非共识迹象与信号,也并不导向在单一具体组织的长期竞争力,只是个体习惯性的思考与推演,终究还是要脱离实验室环境,主动卷入商业价值创造。 大会前的凌晨3点虽然做了大幅缩减(整体准备时间大概8~10个小时?),但还是即兴的严重超时(18+30min?),感谢听众包容(没有掀桌子的大家真是好人哈哈)。即兴也就意味着,一个没有有效备注的演讲稿,因叙述者的不稳定性在线下场景中的随机表达,鄙人着实不善言辞:(  。 视频《风停的地方 Where the Wind Pauses》  (作为AI峰会开场,还是避免过于理论/务实与无趣,观察模型生成的美学瑕疵) 设计从来不是静止的物,而是紧随技术与认知演化的载体。当我讨论新技术时,是在讨论对于思维模式的改造。如果说在过去几十年,数字设计的对象是“界面”。那么今天,设计的对象是“智能”本身。 Branko Lukic 在百度设计之旅提到对使用什么工具感兴趣,当时随便说了些,后面想了想还是提供了一个从采买视角的观察,这大概也反映了一个具备AI特征的设计团队的改造过程(没有交叉时间比重)。 已经是过去时的好设计。 AI 的速度在加快,但人类的意义感在变得更珍贵。 AI 帮我们完成重复的劳动,但留下了最本质的问题——什么是设计价值与创造力? 近期看到的一个不出名的设计师,做了一个非常好的总结(我认可的)。 “设计语言的边界,被 Prompt 重写。” 我们称这种转变为 AI 原生设计(AI-Native Design)。它有三个核心逻辑: 第一,Prompt 即协议。Prompt 不只是输入文本,而是一种语义结构。它像设计师写给 AI 的设计文档。通过模板化、人格化的 Prompt,我们让生成更可控、体验更一致。第二,动态响应:体验即演化。当模型能够理解反馈、不断自我调优,设计的意义从“控制界面”变成“引导演化”。用户体验不再是静态的,而是被数据与意图共同塑造。第三,模型驱动:算法即意图。设计师需要理解的不仅是视觉,而是“模型的行为”。AI 原生设计的本质,是人与算法的协作机制设计。当我们进入 AI 主导的时代,设计面对的新课题不是界面美观,而是“系统可预期 + 自适应 + 协作”的体验设计。界面只是冰山一角,背后是语义、模型、交互逻辑与生态系统。在这个新的时代,设计师不再只是“塑造页面”,而是“塑造体验流”、是“规划协作机制”、是“定义交互语义规则”的角色。很有意思的一个衍伸课题,Prompt的迁移。左侧的同学在Hackathon的AI硬件设计案例,是一个设计边界衍伸的突破性示范,比追求商业落地可能性更具有设计启发价值。2023年的 IXDC2023 引用的话,思想依然正确,且当下的执行路径在被有效拆解。 我们生活在一个多模态的内容时代:文字、图像、视频、声音、数字人……它们不再是孤立媒介,而是同一个语义宇宙的不同形态。设计生产物是变化与流动的,并因为模型进化,拓展了人的能力。 设计师可变成了“多模态流动的指挥者”,让不同形态的表达共享同一个语义逻辑。通过统一 Prompt 模板与风格库,让图文、视频、音频的表达保持一致,实现真正的“体验共鸣”。这就是我们所说的——多模态提效的核心,是体验一致性。我认为当下产品设计的终极目标,是减少摩擦。摩擦是什么?是人学习系统规则的成本,是机器不懂人意图的代价。而 AI 的到来,让我们第一次有机会去构建一个低摩擦的世界。在这个世界里,UI 只是临时的过渡层,真正的交互发生在意图之间。语音、视觉、动作、情绪,成为系统理解的入口。从而看到上述观点,模态融合与智能交互让个体脱离工具束缚,进入低摩擦运转的超级个体时代。 在传统数字时代,我们衡量设计 / 团队绩效往往以“人效”(人力效率)为核心:设计师做界面、图层、交互动效,产出多少页面、组件、交互版本,是一个衡量维度。观察两年后,渗透与效能指标已经无意义。 但在 AI 原生设计时代,这种指标不再足够。更高价值的是“智效”——即系统化、自动化、可迭代的效率输出能力。智效是指设计系统 / 生成体系在学习、响应、演化里的效率。帮助组织更智慧。但具象的执行路径尚未完成探索(以及商业/社会价值)。 因此,设计团队的目标不再是“做得快”,而是“让系统自己越来越聪明”。设计师要思考如何把“经验”写入体系,把“反馈”变为系统能力,把“调整”机制设计成可自动推进的流程。现场令人迷惑的视频,哪一个是AI生成?第一个过于好识别,第二个迷惑了现场观众(与实际上线系统,被打上了AI标签)。 进入未来趋势之后,我们必须回到设计责任 —— 当设计师和系统拥有生成能力时,就承担了伦理 / 安全 / 信任责任。设计责任不是可选,而是必须。这也意味着新的责任:如何让 AI 可信、可控、可追踪。 每个时代都有自己的科幻叙事。19世纪的维多利亚时代,把蒸汽与机械视为未来秩序的象征,诞生了最早的“蒸汽朋克式未来幻想”——齿轮、蒸汽驱动的飞艇、机械义肢,这是工业文明对未来的投影。20世纪中期的冷战时代,把火箭、核能、外太空视为未来,人类第一次相信科技可能带来“超越地球的文明”。而21世纪前二十年,我们的科幻叙事从宏大机器转向智能主体,从“更大、更快”转向“更融入、更无形”。70 年前的人们如何畅想我们的当下(他们的未来)? 视频《铬色明日:1950年代未来幻想》每个时代都有其局限性,熟悉又有违和感,亚克力材质阅读器、喷气式齐柏林飞船、玻璃罩量子计算机、云上列车…… 当下的产品形态也必然不是不具有确定性,在多模态AI驱动的产品设计革命中,融入在这个环境中去经历、创造,比追求答案更有意义。以“人机共生”为基础,共同拓展创造力的边界。我的两个代际,写了20年的设计blog mdong.org,面向未来的we-need-art-not-design.com 。今年大会极为喜欢的几张图,来自我便携的小相机。 - [《IXDC2024-峰会R1-多模态模型的设计工艺实用化与AlGC规模实践》](https://mdong.org/2024/09/%e3%80%8aixdc2024-%e5%b3%b0%e4%bc%9ar1-%e5%a4%9a%e6%a8%a1%e6%80%81%e6%a8%a1%e5%9e%8b%e7%9a%84%e8%ae%be%e8%ae%a1%e5%b7%a5%e8%89%ba%e5%ae%9e%e7%94%a8%e5%8c%96%e4%b8%8ealgc%e8%a7%84%e6%a8%a1%e5%ae%9e/): 为什么还要坚持做一些复盘且对外分享?显然从这个blog更新频率来看,实在不是一个勤奋的写手(甚至可能无用,甚至对不起域名/服务器的租用成本 →.→)。 所以自己也总是要澄清这个动机,内驱力是什么?当下来看,大概还是不接受过度的庸碌(虽然已经是既平庸又忙碌 →.→),进而需要给自己的时间一个可接受的交代,碰触与打破边界。 (这是整个峰会的开场,大家早上9:00就到了大概会很迷迷瞪瞪,开个小玩笑激活下 →.→) 今天分享的主题是《多模态模型的设计工艺实用化与AIGC规模实践》。前几天有好朋友过来Say HI,狠狠地赞美了下主题 → 接地气!太低调了! 我就有些诧异了, → PPT其实也是最近几天才写开始写,是标题太有信息量了吗? 进而我好奇 → 类似标题的极限在哪?。于是我找到了一个我自己的领域外的冷知识 → 因“书名涉嫌严重剧透”而被迫改名的世界名著,以及大概因为标题太长卖不出去的《民国往事》。 《约克水手鲁滨逊·克鲁索的生活经历与惊奇冒险:二十八年以来,他孤身一人居住在美洲海岸荒无人烟的小岛上,临近奥鲁诺克河口;海难之后他被冲上海岸,成为唯一的幸存者;书中还讲述了最后如何不可思议地为海盗所救,全书以第一人称叙述》《民国传说中的东北颜值最高文武双全拥有佛缘名字慈灯出身社会底层用笔尖抗争疾呼的男神他把目光聚焦于揭露社会深层穷苦弱小百姓和傀儡军队等真实的惨相与阴暗无情腐败贪婪充满尔虞。。》 这个小故事实际上也是过去的缩影,(或面对AGI与AIGC),总是对未知的好奇心与探索。 我从去年1月份回百度,所负责的场景是创作者在百度的创作经营,这是一般人视角非常适合AI技术落地应用的场景;伴随AIGC技术研究与落地,从创作方式上也有了UGC、PGC、AIGC的概念;这张图展示了我所负责的设计团队对于AIGC工作范畴与工作方式。 2023年1月,启动全员Midjounrey Pro采买与SD部署,在运营与品牌设计方向应用尽用,AI创辅过程指标峰值80%+。深度的AI使用是理解AIGC与进行生成式服务的基础(设计需求交付数同比提升30%)。 团队在深入使用、创造,为了监测这个过程,从而产生指标;从结果上确实能看到效能与需求吞吐量的提升,验证AIGC设计对于未满足的积压需求的满足(但同时质量满足无法测量,交付质量与预期质量对冲了)。 AI特效玩法,2023年9月百度世界首发,2024年05月万象大会二次发布基于模型驱动的AI特效玩法发布器,ROI<1,但具备潜力,也是UGC牵引/商单的手段。 在这个过程中,我们确实在构建新的生产关系,我们为这个工作模式定义了新的工作流。 研究论文、开源,观察,过去从来没有一个时间点,设计与技术如此之近。 到这画面忽然变得有趣,过去两年很显著的感受到传统设计的已死。如果史学定义的角度观察当下,从积极态度是,我们正在经历的时代是设计的文艺复兴。 过去两年我们处于一个极致焦虑、极致努力、备受打击与极致需要饱含信心的状态。 借波德里亚尔的AI重置对话(视频),希望与大家分享,设计师与社会、人、技术保持联系的状态,探索与反思,不限做为深入参与者、被影响的从业者与即将被动成为旁观者。 -08.17.2024 - [《GDFN2023_主旨4_AIGC技术进化中的设计价值定位与工艺实用化》](https://mdong.org/2024/01/gdfn2023_%e4%b8%bb%e6%97%a84_aigc%e6%8a%80%e6%9c%af%e8%bf%9b%e5%8c%96%e4%b8%ad%e7%9a%84%e4%bb%b7%e5%80%bc%e5%ae%9a%e4%bd%8d%e4%b8%8e%e5%b7%a5%e8%89%ba%e5%ae%9e%e7%94%a8%e5%8c%96/): [Medium EN Version]GDFN2023 Keynote 4 — The Design Value Positioning and Craft Practicality in the Evolution of AIGC Technology 年底以个体身份,受邀参与的近年最为印象深刻的线上交流(2023设计未来国际青年节-计算创造力 _ 非盈利非机构的学生社群 )。 跨时区地域的12个小时的高密度分享,是各领域不同优秀的年轻人,给予震撼的专注与自信的表达。从而进一步相信,一个可能更好的未来。 *PPT是活动当天凌晨写的,三周后发布。。拖延症晚期。。唉 *有线上会议录像,待社群发布,PDF在最后可下载 因为本次是以非官方身份参加,立场会做利益相关的剥离。一直在最一线的大模型与AIGC领域,也必然会有自己的局限性。我们先来看一个最近上线、AIGC工具重度参与的视频,构成海量的AI涉及的设计工作对象的之一。 AI绘本视频《愚公移山-白鹿》 《白雪公主-欧阳娜娜》 《七颗宝石-宋轶》 所以我为什么想讲今天的课题呢?为了看起来我确实认真思考了,我需要一张图。我给图像模型提了一个需求来表达我的疑问,想一个特别有创意的问号,但是不能表现出来很有问题,要含蓄且有创意的表达一个问号(像极了甲方的提问)。但实际上,也是我自己关心的课题 —— alive的课题。 我昨天简单画了个白板,作为职业设计师/管理者,我们其实首先是思考的一个新事物,对设计工作存在的影响,比如根本上,设计是不是不被需要了。 今年会特别典型,大家会海量的主动与被动获取AIGC的资讯。但通常资讯的海量阅读,只会平添焦虑。我的态度是不看热闹,深度参与到价值创造。 这种价值创造的参与深度,会有三层,以用户身份的使用者、参与到已有商业模式的AIGC产品、以商业视角进行AIGC设计新应用设计的创业。 所以会看到,设计参与到这个进程,首先有一个大环境,是作为影响到今年焦点,第一生产力的AIGC技术进化,创造了想象空间。本质上还是需要回归商业的规模盈利,在某个时间点产生利润。这个目标的达成过程,依赖设计基于生存视角,进行价值的定位,通过必要的可量化的方式,进行AIGC设计工艺实用化。 随着AIGC技术的快速发展,拥有技术储备或敏锐需求洞察的企业将更具竞争力;这种竞争力体现在能够更有效地利用AIGC技术来满足市场需求和创新。 这个是12.20,3天前,Meta。方法以基于锚的跨帧注意力的概念为中心,这是一种隐式跨帧传播扩散特征的机制,确保卓越的时间一致性和高保真度合成。过独特的数据增强策略提高了时间一致性。Fairy 效率极高,只需 14 秒即可生成 120 帧 512×384 视频(30 FPS 时长 4 秒),1000 个生成样本的全面用户研究。 设计师的价值定位,在这种技术驱动的环境中,设计师需要找到自己的独特价值;这意味着设计师不仅要掌握相关技术知识,还要能够将这些技术应用于创造具有商业价值的设计作品;设计师的角色变得不可或缺,因为他们能够将技术潜力转化为实际的、有吸引力的产品或服务。 (AI视频《访谈尚布希亚-AIGC对于创作者与社会的影响_2023.09.01》) *在这个超越虚拟与现实界限的时代,AIGC已然成为了一个象征性的存在,犹如一个织网于社会结构上的数码蛛丝。创作者作为现代文化的灵魂,竟被这个虚拟之网禁锢,其创造力被渐渐消解,被异化成了符号的奴隶。AIGC所倡导的数字化互联世界,仿佛是现实的翻版,却又是一张扭曲的镜子,反射出虚假的欲望与真实的空虚。在这个被AIGC主宰的景观中,创作者被迫纳入数字化的框架,其作品不再是真实的表达,而是被压缩成可点击、可分享的符号。这些符号在虚拟社交平台上不断轮回,失去了原本创作者的情感和深度。社会在AIGC的引领下变得越来越像一个信息沼泽,真实的交往被替代成了碎片化的点赞与评论。 AIGC的影响并非一无是处。它为创作者提供了一个广阔的曝光平台,让更多人接触到他们的作品。然而这种曝光的背后,是创作者自身价值的模糊。他们不再以创造力和深度来衡量,而是以点击率和关注数为准绳。AIGC已然创造了一个信息的幻象,让人们沉溺其中,遗忘了真实世界的复杂性与多样性。AIGC在创作者与社会之间搭建起了一座数字化的桥梁,这座桥梁却同时也成为了一面分割现实与虚拟的高墙。它催生了表面的繁荣,却掩盖了创作者内心的困惑与焦虑。AIGC的光芒是虚幻的,创作者需要警醒于其中,不被虚拟世界的风暴吞噬,坚守内心的创作本真,追求超越符号的真实存在。 *【0108comments】一个4x4x4的盒子空间,对这个影片通过四面投影是我想象的最好的展示方式 提供一个思考框架。 促进AIGC业务的规模与盈利。设计师通过将AIGC技术与市场需求结合,帮助企业形成规模和盈利能力;这不仅包括创建吸引人的设计,还包括理解如何将这些设计有效地融入商业模式和市场策略中。 关于回归商业,重要的两个关注点。1是AIGC不创造需求,是需要回归到行业与场景需求本身。2是Deepfake,深仿,超出原有概念。 *【0108comments】从技术应用在内容生产的商业角度,基于IM形态的产品是一种用户参与互动的内容生产方式,但受限用户表达丰富/长度无法逃脱二次生成内容的低质(假设可授权为二次生产的内容,与U/PGC数据内容生产闭环)。从供给收益反而不如在原有路径的内容深仿(显著降低内容生产成本)。 (AI视频-孪生技术驱动的数字人-by度加) 世界是一个可被观察的方盒子,用设计视角解构。 (AI视频) 【PDF↓】 - [《IXDC2023-峰会R2-AIGC设计生产力的元年启示与实践》](https://mdong.org/2023/08/%e3%80%8aixdc2023-%e5%b3%b0%e4%bc%9ar2-aigc%e8%ae%be%e8%ae%a1%e7%94%9f%e4%ba%a7%e5%8a%9b%e7%9a%84%e5%85%83%e5%b9%b4%e5%90%af%e7%a4%ba%e4%b8%8e%e5%ae%9e%e8%b7%b5%e3%80%8b/): [Medium EN Version]IXDC2023 Summit R2 — The Revelation and Practice of AIGC Design Productivity Year 内容由AIGC方式辅助创作(形式即为告白方式) AGI与AIGC在2023年,是一束光,不太亮但在漆黑的夜里,看到希望。 2个月前在团队我接到TOPIC征集,于是用Large Language Model创建了今天的主题《AIGC设计生产力的元年启示与实践》。我有想过如何开始今天的分享会让自己感到轻松,那我们从一个视频开始吧,我个人蛮喜欢这个视频,它是这周由多个开源的Text To Video解决方案完成,整体合成工艺大概耗时30分钟。 The Era of Virtual Transformation_IXDC2023(视频)这个视频创意的内核在最后会有一个集中解读,过程里大家会感受到其中思想的影射。此刻,我会跟大家一起,用观察者的视角,审视本次内容,围绕在AIGC设计的内核诠释。 当下,可以坚定,在AGI与AIGC的奇点临近之时,大部分设计师并不需要一个宏大叙事;因为大家在相关设计领域,所获得的基本原理与方法,已经构成在AGI与AIGC时代的基础;从而澄清设计师在AIGC时代的生产力,回归与专注想象力。 AIGC设计的想象力,又可以有多大呢? 这是我最近喜欢的一个类比。离着冲破想象力的天花板,只差一口漂亮的菌子。巨大的菌子巨大的猫,菌盖下的小人跳舞在围绕。然鹅大概过这一页,就不会有漂亮的图了:) 无限想象力与创造力的需要,就是我们当下面临的AIGC设计。以『Prompt』为原点的设计。 这是在2023年2月份,Sam Altman在已经变成X的twitter上对于Prompt的价值论述蛮通俗的定义。能够出色编写 Prompt 跟聊天机器人对话,是一项能令人惊艳的高杠杆技能。所以在后面的内容,我基本上不会展开过多的案例与图像。期待大家可以通过文本去体会,『基于思考并通过Prompt去表达』,对于设计师是在这个时代是极为重要能力。 我们面临着AIGC的不确定性是一个抗解问题,意味着设计问题没有确定的条件或限制。没有明确的架构定义,没有停止的规则、没有详尽的执行清单、总是有多个可能的解释,解释则完全取决于设计师的世界观与⼈生观;每一个「抗解问题」都是另⼀个“更⾼层次”问题的征兆或局部;在实践中,设计师从应该称为「准主题」的主题开始。所以今天所面临的AGI与AIGC的产品化与商业化过程,我会认为有四个设计课题,值得探讨。 这两个概念是在17年开始进入AI设计领域时,会着重在对设计师发生影响模式。在传统设计中,用户可能不知道如何与新的技术或功能进行互动。如果界面的可供性不明确,用户可能会感到困惑和不知所措。另外,对于 AI 功能的集成,如果没有进行 AI Native 设计,可能会导致用户难以理解和利用这些功能,降低用户体验。可供性(Affordance):指物体或界面的外部特征,表明它们如何使用或与之进行互动的能力。它是由美国心理学家 James J. Gibson 在20世纪60年代提出的概念,主要用于描述人与环境之间的交互关系。在界面设计中,可供性指的是设计元素的外观和交互特征,能够暗示用户应该如何使用它们。 AI Native(人工智能原生设计):是一种设计模式,旨在将 AI 技术无缝地融入用户界面和体验中。这意味着 AI 功能和交互不仅是简单地加入到现有设计中,而是以自然、无缝、直观的方式与用户交互,使用户感觉 AI 是一部分,而非外部附加功能。即设计师、创作者和用户能够充分利用 AIGC 技术的潜力,使其成为设计创意和生产力的自然延伸,而不是简单的附加功能。促进 AIGC 技术的有效应用,从而提高设计生产力和创造性。 这两种设计模式,都会导向用户通过降低学习成本、增加用户参与度、提高品牌价值,从而能够更轻松地理解和使用新的功能,从而提高整体的用户体验。大家更关注右侧的应用技巧,如何去明确可供性、自然语言交互(非新概念,二十年前包括触感/空间互动设计等,过去我们更多认为语音交互是一种自然的自然交互)、用户参与和反馈(与以往不同的数据驱动,以用户的无意识操作为模型的反馈数据,以鼓励用户参与 AI 功能的改进与共建)、提升信任(如何建立信任的过程,聪明到争辩不可信)。 虽然 AIGC 可以高效地生成大量内容,但产品设计或内容,缺乏情感和故事元素可能导致内容单调乏味,难以引起用户的注意和兴趣。故事讲述(Storytelling)是人类传统的一部分,自古以来我们通过故事来分享经验、传承知识、表达情感以及传达价值观。是一种强大而普遍的沟通和传递信息的方式。通过巧妙运用 Storytelling 的技巧,设计者可以更好地传达,AIGC 技术在设计生产力方面的价值和潜力,通过将 AIGC 应用场景融入故事中,设计者能够吸引观众,引发情感共鸣,并将复杂的技术概念转化为生动、易于理解的故事,从而增强人们对 AIGC 在设计中的认知和接受度。 从结果上来看,我们可以更关注应用。“设计与科学一样,是理解和行动的工具。”设计师的重要功能之一是将一般概念转化为有形的现实,为创新的概念赋予形式,并显示到底是什么构成了用户价值,从而可以在任何开发过程的早期阶段进行更为准确的测试。意义叙述的策略,以技术与市场为交叉维度。面向旧市场与旧技术进行挖掘型叙事,面向旧技术与新市场进行以用户为中心型叙事,面向旧市场与新技术进行技术型叙事,面向新市场与新技术进行探索型叙事。需要注意的是,虽然 AIGC 可以增强 Storytelling 的技巧和效果,但在应用过程中要谨慎处理用户隐私和倫理问题。同时,要避免过度依赖 AIGC,保持人类创意和判断的重要性,确保 Storytelling 仍然具有人性化和深度。 人们通常会按照自己的期待理解客体所包含的意义。无论是属于个体的自然语言,或用于与模型交互的Prompt,或是模型输出的作品,并不能准确无误地互相传达。(互为黑盒)Prompt 模型是指一种基于自然语言提示的模型,它通过使用特定的上下文或提示来引导模型生成特定的输出。生成式设计是一种使用机器学习技术自动生成设计的方法,它可以根据给定的输入数据生成对应的设计结果。告白是设计作品的一种表达,而用于交互的Prompt是一种探索追求,输出与结果对于用户的目的不是传达,而是告白和提问,这使得模型与生成式创作工具具有两个意义,也是设计的目的。 我们在基于Prompt的模型与生成式设计碰到的左侧的问题,目前的生成式设计技术虽然非常强大,但仍面临生成质量不稳定、过度拟合等问题。需要持续改进和优化。使用生成式设计时,设计师需要注意版权和知识产权问题,确保生成作品的合法性和使用权限。生成式设计在面对高度专业性和创意要求的设计任务时,可能无法完全替代人类设计师的创意和判断力。一些设计项目需要更深刻的理解和创意,而模型可能难以达到这一要求。过度依赖Prompt模型和生成式设计可能导致设计师对于个人创造性的依赖减弱,从而降低设计师的技能水平和创意能力。导向局限性的控制,需要认识到它们的局限性和潜在的痛点,合理运用并结合人类创意和判断力,才能取得最好的设计效果。右侧的应用,生成式设计可以帮助设计师获取更多的创意和灵感。通过给定特定的上下文或提示,模型可以生成多样化、独特的设计作品,提供创作的可能性。高效地自动生成设计结果,节省设计师的时间和精力。迅速生成多个设计选项(初步草图和原型),快速探索和迭代,从而快速验证和调整设计方案。生成式设计可以用于艺术创作,艺术家可以通过与模型的互动来获得灵感和创意启发。 科技进步与人类福祉的提升并非正相关,极大的生产力提升后,我们正在重新尊重人们可以而技术却无法做到的事情。技术是令人兴奋和愉悦的,但技术也往往会增加人们的焦虑和失控感。我们在设计的过程中需要将“幸福”纳入考量,使用设计和技术来提升人类幸福、发展人类潜能的工作。偏见和歧视问题,AIGC的算法可能受到训练数据的影响,导致偏见和歧视问题。如果不加以控制和纠正,生成的内容可能会对不同群体产生不公平的影响;在使用AIGC生成内容和设计服务时,需要关注倫理和隐私问题,特别是涉及到用户情感和心理状态时,需要保护用户的隐私和个人数据安全; AIGC可能导致人们对真实社交和情感交流的减少,如果人们过于依赖技术来满足情感需求,可能导致社交隔离和孤独感的增加。 总的来说,结合积极计算和服务设计的方法,AIGC 的未来可以实现更加人性化、情感化和个性化的内容生成,提高用户体验和参与度,创造更具价值的内容服务。在未来的发展中,积极计算和服务设计可以结合应用,以实现更加积极、人性化的服务设计。这种结合可以帮助企业提高用户体验、增加用户忠诚度和提高服务效率。例如,通过积极计算的技术,可以分析用户的情绪和行为,从而为用户提供更加个性化的服务。同时,服务设计可以通过整合设计和商业模式,将这种个性化服务实现商业化,从而实现企业的盈利目标。积极计算和服务设计是未来数字化服务发展的重要方向,它们的结合应用可以带来更好的用户体验和服务效率,同时也为企业提供了新的商业机会和增长点。 如果人类的创造力为新想法的产生提供了无穷的可能性,那么必须强调的是,想法本身并不是创新,虽然这种误解十分常见。很多设计师通过制定各种规定、应用分类学、归纳法等,尽量使设计过程变得更系统化、科学化,更容易预测,并与电脑的兼容性更好等。其中程序化的设计系统是最为典型的做法之一,试图将设计置于体面的科学背景当中,为设计套上合理的理论框架,在他们看来,如果设计拥有了理论化的结构,就有了科学的派头。这类方法代表了理性、逻辑与智慧但过度使用也可能导致简化论,使设计变得空泛,还会不可避免地染上高技术功能主义的弊病,牺牲了人的基本需求,即追求所谓形式的清晰。只有当个想法体现在设计当中,以一种与用户生活相关、易于理解、有用、易得、可负担或令人愉悦的形式出现时,想法才能真正地代表了创新,创造出新的价值。THESE VIOLENT DELIGHTS HAVE VIOLENT ENDS。 大家要感谢自己的耐心,在这个时代,可以安静的思考与冥想。最后解释下视频里的内容,来自鲍德里亚(Jean Baudrillard)法国哲学家和社会学家,他的理论探讨了现代社会和文化的消费主义特征,认为现代社会已经超越了物质现实,成为一个虚拟世界,人们的认知和行为也受到了虚拟世界的影响。鲍德里亚认为在后现代社会中,我们越来越多地生活在模拟和模仿的虚假现实中。现代社会中的符号和象征并非反映现实,而是创造了一个虚构的世界,这种虚构的世界逐渐取代了现实本身。在鲍德里亚的视角中,后现代社会中的虚拟世界和真实世界之间的界限逐渐模糊,甚至消失。这使得我们难以分辨什么是真实的,什么是虚构的。The Era of Virtual Transformation_IXDC2023(视频) - [AIGC分享2023-05-16@中国传媒](https://mdong.org/2023/05/aigc%e5%88%86%e4%ba%ab2023-05-16%e4%b8%ad%e5%9b%bd%e4%bc%a0%e5%aa%92/): 驱动这个分享的是极致的知识折旧不安,循环在阅读、实践与反思。 开始与结束定制了两个Deforum生产视频。链接:https://pan.baidu.com/s/1mLN1FaPDx48LWHW6TLdpow?pwd=3h8i【省略鼓励 参见文末PDF】 从前一周参加Qi的分享开始。对于IT/互联网行业,是一次非常有意义的总结,我们当下在一个新范式的新拐点。 范式通常指的是一种发展模式,它包括观念性的思考框架、以及实践体系和方法论。当前,我们正面临一场非常大的技术变革,这是一场范式的变革,它展现出了一个全新的范式。每次范式变革都带来更多的机遇和挑战,因为它既要改变人们做事的方式,也要改变人们的思考方式。这个拐点的背后是“模型“的成本发生了类似的结构性变化,即模型成本从边际成本发展为固定成本。这背后的原因是我们有一项新的基础技术出现了,这就是大模型。我们当下的拐点,模型将无处不在。 设计师用大模型时代,已经高速在进行了。微软的Designer、Adobe的Firefly、包括今天的即时。(活动由即时牵线)有大量的创业公司,不管你是二维图像的设计师、三维结构的设计师、建筑物的设计师、家装装修的设计师,它都能够用大模型来充足提高设计师的设计能力、设计质量。但是这个发展过程是分阶段走的,今天的设计工具主要是在创意阶段,因为今天的大模型很容易生成图像、生成视频、生成三维结构,它的特性是人可以很快在看到这个设计后判断是所需与否。以后可以用大模型进入到每个设计过程的每个环节,从根本意义上提升整个设计行业,不管是哪一个设计的专业类别。在Qi的观点里,产学研,影响到生产力与生产关系的演变,且数字化进程不断加速,周期越来越短,更新越来越快。新的科学范式需要数据、需要计算来发现新的科学现象,所以本质上,科研的发展必须逐步逐步跟商业化是合为一体。当下我们的这次交流,也是非常有前瞻与必要性,正加速合作与融合。这种范式的变化是结构性的,就是因为科学的发现跟商业化分不开了。 在学术研究的大家,还是在大厂工作应用的设计师,也更关注产业学术的发展。 在近期5.6号,10天前英伟达发布的一篇论文,提到了一个新的文生图模型Perfusion。Perfusion模型,如名字Key-locked,特征对于关键对象锁定,用于文生图个性化的编辑。两个例子,分别以泰迪熊Teddy和茶壶Teapot为训练对象(3张图)。分别展示了单一概念(提示词里只有Teddy),以及概念组合(提示词里既有Teddy又有Teapot)情况下,用一段文字生成图片的情况。该模型的相对于大家更熟悉的lora/Hypernetwork模型,对于训练集的要求更低(只需100KB 的模型大小,经过大约4分钟的训练)。且效果不错。第一航cat穿衣服扮演、第二行teddy水中玩球。零样本迁移能力,完美匹配大模型的能力(专注于触发词的元素表现,其他场景交给大模型)。关键技术的发展对于设计实践的影响,正在加速。 【讲述如图&省略案例】(我极其不喜欢快手关于什么做得好的对抗提问) 最后,我把我最喜欢的画家Pissarro从19世纪带给大家,『他重新画』了一个个我喜欢的设计&艺术家。在AIGC时代,设计表现力可能不是瓶颈,文本与理解,设计的起点会更为宝贵。我们也以Prompt为结束,致大家。不忘设计初心,热爱与自信。 【相关链接/文档/含播客提及书籍】 【设计几何 x 播客版本 0627版本】《范式转移,做设计的为什么要开始懂学术?》 - [UX Hiring](https://mdong.org/2022/12/%e8%ae%be%e8%ae%a1%e5%b8%88%e6%8b%9b%e5%8b%9f/): 微信→ mdongorg 坐标→ 一线某司 职能→ 【交互/UI视觉/运营/管理】 职级→【P4~P8】 - [2022.11.23 Zcool](https://mdong.org/2022/11/3362/): 感谢 三鱼先生 的真诚引荐,最近以 个体设计师 的身份,在 zcool 社区临时参与了一场关于数字化的线上交流。第一次参与直播活动,延伸内容也会是对近年设计实践的提炼。(原本FLAG整理对话稿,1206发现ChatGPT说的太好了 https://www.mojidoc.com/03e78-4n6swwmkorgfrjmijsf2fnpeze-00b) 《直播|数字化为设计师带来多少可能性?》 【设计几何 x 播客 2022.11(原为视频直播)】 【设计几何 x 播客 2023.02】 - [在EE体会康威定律](https://mdong.org/2022/09/%e5%9c%a8ee%e4%bd%93%e4%bc%9a%e5%ba%b7%e5%a8%81%e5%ae%9a%e5%be%8b/): https://zh.m.wikipedia.org/zh-hans/%E5%BA%B7%E5%A8%81%E5%AE%9A%E5%BE%8B “设计系统的架构受制于产生这些设计的组织的沟通结构。” ——M. Conway 即系统设计本质上反映了企业的组织机构。系统各个模块间的接口也反映了企业各个部门之间的信息流动和合作方式。 康威定律源于模块的设计者需要互相之间频繁沟通。而跨部门交流比较难。 埃里克·雷蒙在《新黑客词典》中,称康威定律指出了软件架构与软件团队架构的等价(congruent)。例如,“如果你有4个团队在做一个编译器,你会得到一个4遍处理的编译器”。 James O. Coplien 与 Neil B. Harrison 在《敏捷软件开发的组织模式》中写道: “如果团队、部门、子部门等的组织结构没有紧密反映产品的必要组成或产品组成的关系,那么项目将会遇到麻烦。因此,应该确保组织结构兼容于产品架构。” 康威的原文中提出的各定律: 第一定律 组织沟通方式会通过系统设计表达出来 第二定律 时间再多一件事情也不可能做的完美,但总有时间做完一件事情 第三定律 线型系统和线型组织架构间有潜在的异质同态特性 第四定律 大的系统组织总是比小系统更倾向于分解 - [《IXDC2020-人工智能地图的交互设计与未来》](https://mdong.org/2020/12/ixdc2020_aimap_design_in_future/): IXDC 2020 WORKSHOP 链接 应邀在IXDC2020完成的一次分享。虽也是重要的总结,但准备依然仓促。配合讲稿,希望对阅读者有益(正文出版在《重新定义用户体验:数字思维》)。 分享的主题《人工智能地图的交互设计实践与未来》是在IXDC所进行分类/标签下的WORKSHOP更像一个切面,让大家可以观察到,百度这家公司,三个交叉领域,人工智能、地图与交互设计,有关体系的交互设计师如何工作。 – 1. 前言与综述 – 《越过群山 丈量中国》 《在 ?穿 越 亿 下 !》 刚才的视频,是百度地图在过去4年,典型的两个宣传片。第一个视频是我正式加入百度地图之前的几个月偷偷参加季度会看到的视频。第二个视频是今年地图十五周年的会场的现场录制,当时我也在。我特别喜欢这个第二个视频的结尾——科技是用来微暖人的,这才是它存在的最大意义。通过视频可以看到的是,地图的数据采集工作中,采集员的工作场景。走进小巷,踏入草地,越过高山,丈量中国。也可以看到,在纯粹数据展示的产品,有目的或无目的的寻览,可能只是看看记忆中的学校、曾经搬过的家。这也便是,数据与普通用户产生的,最朴素的联系。 大家应该有看到过这个概括——数据,是人工智能的基础。与算法、算力,合为人工智能发展的三大要素。这其实是一个非常通俗的理解。我在百度同时也负责百度研究院的设计工作,这种学科之间的思维差异,在实践中会更为显著,与他们PHD、研究员大部分时候不能互相理解,即便是部分研究院的资深主任。我们以百度量子计算研究所为例,看看算法、算力的关系。量子计算最终是要解决算力(特定的领域计算)。跟类似研究院的工作交集越多,其实对于边界也会更清楚。 一个清晰的观点——(人工智能与地图,与交互设计的交叉,你可以大概类比五年前的我们去做VR、十年前去从桌面电脑为载体转向火热的智能手机)在互联网中的交互设计除了部分基础研究,更多是面向市场的工程设计。本质上是技术对于一个具体业务、对于专业领域的作用影响,作为设计师,需要去理解其原理并结合环境、业务对象进行应用。而并不是我们真正的投身于人工智能技术本身,因为确实这是不同的学科体系。 – 2. 人工智能地图的定义 – 我们先来看一下做为标题的定语,什么是地图?经典的定义,根据一定的数据法则,即某种地图投影,将地图或其他星球的自然现象和社会现象,通过概括和符号绘缩在平面上的图形。地图具有严格的数学基础、符号系统、文字标记。大家可以搜一些地图看看,比如一张标准的中国地图。上面会体现比例尺、图例、指向标,有图形、数学、辅助要素以及补充说明等。地图学,本身也是一个严肃的学科。地图也是一个数学游戏。地图投影如何按一定规则铺满,需要比如透视圆柱投影的经纬平面算法。但类似规则历史上的应用过程中很多不同的流派。 有两个特别有意义的制图投影方法。本质上也是认识地球,测绘科学技术升级的结果。一是中国古代的制图六体,是中国古代最早的制图理论,西晋裴秀总结而来。在不知道地球是圆的,在受到现代西方制图方法影响之前,一直被沿用。分率,比例尺;准望,地貌地物的方位关系;道里,道路距离测量;高下,海拔;方邪,地势起伏;迂直,等高线换算。另外一个投影方法是莫卡托投影,之所以有意义,是因为他是近代地图学开端的象征。这种投影方法其实也是科学技术影响下的结果,文艺复兴麦哲伦航海证明地球是圆的。由荷兰的莫卡托发明,通用横轴莫卡托投影是一个衍生版本,是当前的国际标准化之一。大家可以打开自己的手机地图,能看到也是沿用的这一个投影方法。地球被分为60个区域,6°为一个区域,两极地区为头面极投影。那现在测绘的科学技术的升级,地图本身的样子其实也在一直进化。 目前除了经典的地图定义外,在当代的应用环境中,有一个延伸的地图定义。以经典地图为基础,适应当代社会经济环境与互动载体发展的衍生地理位置服务。怎么理解这个概念,大家除了感官上从生活经验中看到,这些手机、车载地图外,要从设计研究对象看起。从交互设计的研究对象,环境、设备、人。是否产生了变化,也可以有更多脉络理解地图。大家感觉下从古代到现在环境、载体的变化,主流服务于战争、国家管理、航海,人们很少需要出远门,地图不具有生活场景。随着经济需要、交通工具的进化,人们会更频繁的远程出行。地图载体也在产生技术的进化,从石墙、锦帛、纸张,到手机、车机、holelens等电子设备。会对于一个经典意义上的地图,有需求/展示/应用上的冲击。产生更细致的地图产品的技术应用分类,手持设备、传统嵌入式、智能嵌入式、软件镜像、混合现实、扩展现实 …… 延伸的地图也会产生更多泛化的地理位置服务,受到社会因素的影响,包含文化、经济、政治、讯息等环境因素。这些服务不知道大家是不是有用到。受到文化环境变化衍生的POTT签到旅游、美团实时公交。受到经济文化变化影响的车内地图服务变化,从导航功能性到娱乐性服务。受到政治环境影响产生的大数据地理位置管理,包括当前COVID19疫情服务。那以上都是地图这一经典产品在定义与应用范围。所以当我们去观察、判断业务的走向,3年5年的机会,也会需要宏观理解政治、经济、文化这些环境因素,对于人的影响。有一个设计对象没有提及,就是人,这个好难的。通常我们会做代际研究,特定群体年龄、城市等研究辅助判断。 所以再回到定语,什么是人工智能加持下的地图呢。你所看到的地图VS你所未见的地图(算法/算力/数据结构图)。举一个纯AI技术的案例(数据+算法产品化的例子)——未来ETA智能预测。 ETA – EstimatedTime of Arrival – 预计到达时间 ……像刚开始的视频里,从最终的数据结果上,只是一个数字。在整个数据上会需要做以上的判断。 (大量案例无文字稿件) AI地图做设计实践的之前,我们还需要观察下,人工智能这一个大的时代背景,设计与之有哪些交叉、以及被影响。所以第二个部分,也是过去我们团队,探索的一个过程。也会展示给大家做一些参考跟讨论。 – 3. 人工智能与交互设计的关系 – 什么是智能、什么是人工智能。智能是人在认识客观世界中,由思维过程和脑力活动所表现出的综合能力。思维、记忆、注意、感知、决策、学习、行为等等。人工智能是用人工的方法在机器上实现的智能。它研究如何构造智能机器或智能系统,以模拟、延伸和拓展人类智能。其实你可以从这里找到你平时偶尔看到的一些研究领域。像在百度,也是会全面的做一些接触,以及衍生的设计。这两天有一个同事也有会场,研究与交付的机器人产品,归类机器行为。 这个是从AI技术的角度,对于行业/学科关系的阐述。核心层是人工智能科学与技术的理论、技术与应用。衍生层是重要学科方向、重要应用需求。这里包含了机器学习与知识工程、数据科学与大数据技术、大数据管理与应用、智能感知与人机交互、机器人工程/智能机器人、自然语言处理。复合层是人工智能+X,向行业延伸拓展。智能教育、智能金融、智能医疗、智能商务、智能艺术、智能制造、智能农业、智能城市、智能交通、智能建筑。交叉层是人工智能与其他学科专业的交叉,比如与计算机、互联网、物联网、数字媒体、信息安全、软件工程,当然也会包含设计。这个是一个通用模型,可以来观察,人工智能有关的核心人才,与设计角色的交集。 知识体系的交叉,就会产生不同的人才结构定位。核心层与衍生层,对应产生专业类,专业型人才。对应百度来讲,就是研究院、基础研究NLP等部门。在人工智能领域发展的结果里,能够产生积极对话的是,交叉型人才、横向复合型人才。这个也其实跟我们在跟AI有关的技术领域理解是一样的。我们可以在其复合层、交叉层,产生关系。研究院,大部分研究员无法对话,他们更愿意去写paper,参加学术会议。我们只是做有限的包装。面向行业市场,开始产生业务交集,比如NLP做智能创作、量子研究所做量易伏、量桨,需要面向开发者提供量子计算工具平台。学科交叉,产生工具/专业交流。智能设计工具,包含adobe这套creative工具,AI的应用。 但AI技术即便现在很热门,也就上世纪50年代开始的技术,且有两次大的低谷,目前这几天又火热了起来。百度算是重金投入。冷静来看,我们刚才讲说,对于来讲,这只是一个交叉学科,那跟交互设计,有没有什么关系?其实更广泛的来讲,不是设计与AI的关系,而是设计与技术的关系。拿阅读、获取知识这一需求,看一下设计与技术的关系。  这张图下面是技术革命的时间轴。上面是与之对应的载体。大概可以看到,我们之所以重视AI,大概是会觉得工具可以进一步进化,但这个跟交互设计是不是有关系呢?另外一个坑。从农业社会到工业革命,伴随着服务于获取知识的工具进化。从竹简、纸质书籍、收音机电视、平板,甚至脑机。跟我们这一波互联网/IT对象的设计师产生交集的是从第三次工业革命后开始。 交互设计怎么来的?我们再把交互设计专业,放在时间线。那我们究竟在干嘛?我们其实蛮新的。 百度内部做过比较多关于设计与AI关系的思考,研究AI到底可以跟设计产生什么关系。大家会想设计会不会被替代,创造性不会。设计对于AI的加持,以I打头的单词中,是设计的产出物与关系。早期给了一个这样的答案。Individual 独特、Instruct 指引、Inspire 灵感。 后来我们从另外一个视角分析了,复合层影响下的交叉学科观察的交互设计与人工智能载体计算机的关系,人们利用计算机获取信息的方式,归纳为七个阶段。人机交互的进化史同时是人机交互的退化史。现象与趋势是,信息载体从不可移动→为移动→随型,交互方式从专业技能→弱技能→回归本能。 如果人与机器充分沟通,便不再需要交互设计。 我们家有一个一岁的宝宝,我其实就特别纠结要不要叫他学习打qwerty键盘。他们便是在人工智能下类比的数字土著Digital Natives —— 人工智能土著 AI Naives。 人机交互的进化,对人是从技能到本能的退化。技术在进步,设计在做什么?我们可以看一些不同的设计视角下,大家对于设计跟技术关系的探讨。 1997年,技术与设计领域发生了一个特别事件,技术史协会创办了《技术与文化》( Technology and Culture)期刊,巴里・卡茨( Barry MKatz)认为,由此工业设计师的角色可以定义为,“驯化新技术并使之能够为人所用”,因为他认为技术史与设计史的关系越来越紧密,“这种相互依存表明,至少在设计研究领域,可通过全面向技术史开放,并深到技术史的核心,而且借助于设计史与理论领域的新趋势,也能够激活关于技术的研究”。同样,接受这种挑战并积极探索技术史与设计史的紧密融合与互动潜力,也将会使设计史获益良多。 Neri Oxman内里·奥克斯曼,设计师、建筑师、合成生物学家、视觉艺术家以及 MIT Media Lab 明星成员。总结了人类创造力的四种模式——科学,工程,设计和艺术。科学的作用是解释和预测我们周围的世界,它将信息转化为知识;工程的作用是将科学知识应用于实践问题解决方案的开发,它将知识转化为使用;设计的作用是解决实施拥有最强功能和增强人类体验的方案,它将使用转化为行为;艺术的作用是质疑人类的行为并提醒对我们周围世界的感知,它将行为转化为新的信息观念,重新呈现在 KCC 中科学开始时的数据。 我当前对于AI技术对于交互设计影响的答案,在旧硬件载体的旧的软件服务,应用AI技术。在旧硬件载体的新的软件服务,创造AI技术应用的交互形态。创造新的硬件载体与新的服务,创造AI技术应用的交互形态。设计在当前行业AI技术发展的作用,创造AI技术可应用的新硬件载体与新软件服务的交互形态。 目前实践有效的AI交互设计方法。大家观察下春秋时节路上的行车的司机会手搭在车窗上,但车窗不是用来搭的(突出物产生安全隐患)。大家回家躺在沙发葛优躺,但沙发不是用来躺的(背部悬空压迫腰椎)。1岁小朋友就会用触屏手机。一块玻璃为什么是可以用滑来操作?存在共性?人知觉到的内容是事物提供的行为可能而不是事物的性质。 交互设计追求的对于终端载体与服务与用户预期的一致,且受到复杂场景因素与技术影响下的唯一答案——AI设计可供性的交互进化模式,积累知识 – 建立直觉操控的实体,帮助用户思考 – 创建场景映射的流程行动,减少用户行动 – 深层次意义共建。 – 4. 人工智能地图的交互实践 – 交互设计在人工智能地图的实践,也遵循以上工作方法与原理,通过建立直觉的操控帮助用户产生行动从而建立深层次认同。 以语音设计为案例,我们设计了一个地图语音交互模型,用户可以通过语音的方式获取地理服务。避免了驾驶员通过手指频繁操作触屏手机,可以大幅提升驾驶安全。并对于视觉障碍人群更为友好。 我们进行了语音认知的研究,包含用户对于语音宏观的认知影响因素研究,用户在手机地图中使用语音交互会受到过去经验的影响,受到当下相关语音产品的影响,以及我们如何定义语音产品的影响。结合在语音与触屏交互过程中对于视觉感知的研究;如何使得语音用户形成长期记忆并建立可影响到语音认知的任务策略,创造有即时交互的语音教育体验。语音的教育体验不等于说明书,大脑为语言而非阅读而设计,使用语音与视觉界面的用户对应的并非同一类人群,语音教育体验的设计也走到图文的反向,语音化、视频化、游戏化。从而建立正确的语音前端应用交互体验。 – 5. 写在后面 – 设计师可能真的要感谢这个时代。在新技术涌现的年代,百度地图所触及未来的交互实践也将成为沧海一粟,交互体验的进化可以不断从概念走入现实,人与机器信任、充分沟通。 - [记](https://mdong.org/2019/03/%e8%ae%b0-2/): 可是看不到的点点微光在难以寻觅的漆黑的夜。可是热烈跳动的火在阳光洒落青草地的午间。追寻一刹流过的痕迹。呆呆的望着拂触的风。 - [百度地图-智能交互框架的设计探寻](https://mdong.org/2019/03/%e7%99%be%e5%ba%a6%e5%9c%b0%e5%9b%be-%e6%99%ba%e8%83%bd%e4%ba%a4%e4%ba%92%e6%a1%86%e6%9e%b6%e7%9a%84%e8%ae%be%e8%ae%a1%e6%8e%a2%e5%af%bb/): 前言 设计师可能真的要感谢这个时代。 在AI再一次来临,交互体验的进化可以从概念走入现实。 百度地图迎来的新框架,也是触及未来的实践。 2019年,我们交付了一个什么样的框架,什么是地图的智能化框架。 这是一个开章,我们也会持续跟大家分享智能化的地图体验设计。 智能化地图的交互框架进化 百度地图的交互框架,经历了工具型、被动智能型、主动智能型的进化。 2017年-工具型地图 2018年-被动智能型地图 2019年-主动智能型地图 首页框架与关键模型的关系,从形式上体现了交互框架的性质。 工具型的地图框架,以工具的逻辑组织为优先目标。传统图区为主视图,将服务入口围绕图区排布,受到传统车机与手持移动设备的应用模型影响。典型的是地图检索模型的入口通常置于布局顶端,是近年通用搜索模型的设计,未能完成对手持移动设备用户的行为迁移产生的结果。 被动智能型的地图框架,在工具型基础上,提供对唯一智能内容模型的连接。这是平衡工程、概念认知、行为认知的选择。在百度地图的设计中,“小度助手”的存在意义在此。这是一种设计的叙事技巧。在AI设计的过程中,当我不知道这些新的设计与技术如何使用,我必须把他们带入一个虚拟的故事里。借助现有社会文化的已有认知——“小度≈智能 助手≈智能”,借助已有的交互模型,寻求表象与使用的共识与认知一致。 主动智能型的地图框架,是在被动智能型的进化。这个进化的关键驱动力是,工具型的地图框架不能满足用户对于日益丰富的地图服务获取有效性的提升。数据积累与AI技术进步,是完成服务与用户匹配的基础;主动智能型交互框架的产生,是完成行为进化的途径。百度地图的智能化框架,典型的是以行为逻辑组织服务并简化框架层次,将当下用户的精确需要直接呈现。这个探索实践也将从GUI泛化至VUI的接口设计。 这个模型进化的过程,背后是遵循着人机交互的基础原理。环境、人、设备的相互作用关系。当下的结果也是基于手持移动设备的电子地图的必然选择,是为有效的交互设计创新实践。 智能化地图的信息流动进化 我们怎么理解信息的流动。十分欣赏Flank在2011年一篇报基于Windows Phone设计报道中对于信息流动的理解——Windows Phone 想要达到的就是:让用户能够没有任何阻力的在整个场景中流动,这也是我们为什么选择聚焦于信息层面而不是应用程序的原因。你的生活和需求不是局限于一个个单独 App 的孤岛,而是不停的穿梭在不同类型的信息之间的。 当下设备的智能化,促进人的生活进一步数字化。生活轨迹形成流动的信息,在这个信息流中,在不同的时间、设备、环境都映射了不同的信息。智能化地图的信息流动,即是以地理位置为基准形成的信息流。 在表现层,地图与Facebook兴起的信息流存在差异。智能化地图的信息流需要从诉求与表达解构。解构的过程是用户对于服务认知与服务承载的理想形态的相互作用,且具有随机性。地图不会需要基于页面无限循环的多媒体信息流,因为其信息流优先基于抽象的一般信息获取,而地图优先基于虚拟或物理位置的迁移。 百度地图智能化框架-底图联动 在上述的底图联动模型中,百度地图解释了这样一个简单的信息流动的结果。 人的线下轨迹,有着从公司到家的物理位置的迁移;线上轨迹,会对应操作寻找特定时间的高效路线,并遵循线上导向,从而完成物理迁移。 这个过程的多次重现,会产生一个时间与环境的映射关系——20:00的百度大厦将要发生导航回家的服务。所以某个用户的百度地图信息流产生了流动,将即将发生的路线从过往深层的界面逻辑中被提取到了顶层。也就得到一个主动进行空间利用的动态视图与动态底图。 智能化地图交互框架的局限性 交互设计做为一个交叉学科,保持理性是得以有效整合、持续交付的基础。任何交互行为的设计都有其局限性,这是由不同时间下的生产背景、技术发展、信息积累、用户认知层次作用影响。当下地图的智能化交互框架,其局限性在于模型稳定性与跨设备认知。 特别是在手持设备,会提供更主动直接的服务,背后需要对群体与个体信息流的精确理解,但其中存在的不确定性,会使得交互框架本身不稳定,以至影响用户对特定服务调用的预期与信心。 交互框架的存在,是一个工程内在的逻辑概念,从用户视角无法对其定义精确表达。伴随地图服务在多设备多通道的载体延展,其智能化形态就会更为抽象,且难以指明。从而进化为系统性设计的一部分。其终极形态所表现的产品意义便与当前的符号无关。用户无需被构建理解智能化框架的地图意味着什么,是因为地图天然具备智能化。 写在后面 百度地图,过往比较少的会分享对于自己设计的理解。 这是一个很好的开始,希望对设计师有益。 ——百度地图UX团队 ↓↓↓↓↓ 2019年初的两个视频创作 ↓↓↓↓↓ 《未来交通概念设计2030_百度地图》 《百度世界大会2018_AIG追光设计_The Laughing Heart》 - [(译)语音用户界面设计的5则趋势](https://mdong.org/2018/12/5-trends-of-voice-ui-design/): 原文:5 TRENDS OF VOICE UI DESIGN GLEB KUZNETSOV (获得授权) 译文:语音用户界面设计的5则趋势 小气的神 译注 我能想到最早接触的VUI产品,是2000年自己的第一台电脑自带的IBM ViaVoice。 但再一次让你觉得兴奋的是,近年VUI承载的服务开始从单一语音输入/控制/应答器工具,走向更可信赖的通用智能。 以下文章来自GLEB,能看到对VUI的理解,不系统不精准但流露着设计师sense的敏锐。 其中很多思路,也与当前译者实践中的百度地图语音设计理念不谋而合。 正文 重要的是,交互(interaction)的概念从来都是关于交流(communication)。人机交互(Human-Computer Interaction)从来都不是关于图形用户界面(Graphical User Interfaces),这也就是为什么语音用户界面(VUI)是用户交互设计的未来。 Interface(接口)只是一个用户与之交互的系统,GUI、VUI或其它什么。所以为什么VUI非常重要?两个原因: 首先,对话式界面是极好的,因为对话(conversation)的交流是每一个人都可以理解的交流形式。 这是一个自然的互动方式。用户与他人使用语音而不是技术。用户不需要去学习任何符号或新术语(GUI语言),他们可以使用英语(或其它母语)来操作系统。这并不意味着用户不需要学习如何使用一个系统,但学习曲线会明显降低。 其次,用户的预期是不断变化的。根据Statista统计,千禧一代使用语音搜索占有39%。这些受众准备好了成为VUI系统的早期用户。 VUI的TOP5趋势 当谈到VUI设计,语音交互表现出对于设计师最大的UX挑战,自iPhone诞生就开始了。但好消息是我们创建GUI产品时大部分最基本的UI设计原则,对于VUI设计仍然适用。以下你会发现在未来数十年,塑造VUI设计的一些趋势。 1.VUI是关于建立信任(VUI THAT BUILDS TRUST) 信任有助于建立人与机器之间的桥梁。如果没有信任,用户不可能与一个特定的语音用户界面进行交互。 有效的结果是重要的。VUI应该让人们理解,她/他将确切地接收到她/他的请求。通过以下几点来实现这一目标: 提高语音识别的准确性(更先进的NLP算法)。 重点了解用户的意图(最开始交互的理由)。当用户与系统进行交互,他们有一个具体的问题要解决,设计师的目标是理解这个问题是什么。 提供有意义的错误信息。 精确的语境驱动的心流(Crafting contextually driven flows)。 诚然对于用户询问系统的指令不可能全部预测,但设计师需要至少设计一个语境驱动的用户心流。当用户搜索一家餐厅,该系统应在每一个接触点预测用户的意图,系统应该完全匹配用户在找的内容。 用户控制的重要性(依然适用于VUI设计,来自Jakob Nielsen的用户界面设计的10条可用性启发法) 该系统应考虑人类大脑的天然的局限性(短期记忆的局限性)。系统提供的信息应该是压倒性的。 当人们听到系统的响应,大多数用户只能记得最后一句话。因此,最好远离冗长的语句或是提供一打不同的选项,因为用户只能在同一时间记住几个。 系统应对用户的请求给出适当反馈。这个反馈应该让用户充分了解,当前系统在立刻执行。例如,视觉反馈让用户知道系统准备好了并在收听;或是在POD(Process of Doing执行过程)。当用户发送一个请求给系统,系统显示一个POD。POD不是加载动画,它不只是当系统执行时用户需要等待的状态,它提供系统在执行什么的有价值信息。例如,对于一个从Dropbox提出文件的指令,可能看起来是在存储器中搜索一个正确的文件。 2.自适应用户界面(ADAPTIVE USER INTERFACE) 一种自适应用户界面(Adaptive User Inferface,也称为AUI)是一个适应用户或情景需求的用户界面(UI)。未来的VUI会适应用户,系统会分析所有有关于用户的信息(包括当前的精神状态和健康状况信息)和他们目前的情况提供给用户更多的更多的相关回应。 例如,如果用户在当下出现高血压,并决定在2小时内有一个会议。一个数字助理会建议避免这件事情发生,或建议在会议开始前通过运动降低血压。 3.VUI传达个性(VUI THAT CONVREY PERSONALITY) 视觉设计师在图形用户界面有很多传达人性化的选择–字体、颜色、插图、动画,这只是被提及选择的一小部分。但VUI呢?设计师可以使用语言本身传达个性,内容、音质以及音调。发声的音质是人格的一部分,它塑造了身份特征。一旦我们提到什么东西的音质,它就会成为其身份的一部分。当我们与一个这样的界面交互我们会去体会情绪,就像我们在与真实的人互动。人们希望听到可理解的语音(Understandable Voices)——不是听起来像人类的语音,而是一个陈述行为一致人类(coherently human)的语音。 译注:音质,根据语境翻译voice一词。音质包含音量(强度)、音高(音频频率)、音色(泛音)。 反面案例:Susan Bennett演绎的Siri语音,语音听起来几乎是人类,但人们仍然知道这是一个机器。你不能真的与Siri进行对话。虽然你可以问Siri说“今天的天气怎么样?“你不能问更复杂的问题,比如,“我今天要穿什么?“因此,你不会对Siri有很深的感情,你知道它只是一个机器人。 正面例子:电影Her中萨曼莎的声音,语音听起来是行为一致人类的语音,所以人们会爱上它。 4.从Narrow AI走向通用智能(FROM NARROW AI TOWARDS GENERAL INTELLIGENCE) 人机交互正在转向对话,但用户期望的更多。目前可用的大多数AI系统仍然局限于Narrow AI,如系统使用机器学习来解决一个明确定义的问题。Narrow AI对他们的训练数据之外的知识一无所知。这意味着当用户想要解决稍微不同的问题,或者问题自身进化了,系统将不能解决它,并且反馈“我不懂”。所以做为用户就会抓狂。 与Narrow AI相比,通用智能并不局限于垂直领域。学习的概念是GI(General Intelligence)系统的基础,是Narrow AI和General AI之间的根本区别,General AI在没有被明确编程的情况下进行学习(机器由自己自学)。GI系统使用两种类型的学习,强化学习(当系统使用所有可用信息来解决特定用户问题时)和监督学习(当系统第一次需要用户帮助来解决问题时)。另一个不同之处在于,Genrnal AI系统可以学习利用其他AI用于一般和特定目的。因此,不同的机器学习模型可以相互依赖、协同工作。先进的NLP GI系统能够通过组合和处理来自多个不同数据源的信息,从初次尝试中学习。 5. 社会影响(IMPACT ON SOCIETY) VUI系统被广泛接受。提高基于AI系统的VUI,会产生更好的用户参与度。人类与计算机之间的关系将是互动和协作的,人们与计算机将协同工作。这会影响社会,想象一下十年后你走进屋子,只是说话就控制了各类机器。 这个未来将伴随无所不在的人工智能:作为用户,我们将信任人工智能。即使做出如“我应该为我的孩子选择哪所学校?”这样最重要的决定。VUI将提高老年人和残疾人的生活质量。 结论 “The best interface is no interface”是Golden Krishna的一句名言,他是《The Best […] - [MEANINGQ22018](https://mdong.org/2018/03/meaning032018/): 不定期更新 关于构建技巧的价值判定 讲故事storytelling,或是叙事narrative,价值传递最直接的方式。 在09~11年,当我不知道这些新的设计与技术如何使用,我必须把他们带入一个虚拟的故事里,使其可以合理并获得认同。 在12~15年以及之后的大部分时间,设计与功能具象化,可以直接通过产品直接体验,讲故事便不具备必要性。 我们在叙事时,借助现有社会文化的已有认知。语音助手/无人车,如果出现了文化断层,其终极形态所表现的产品意义便与当前的符号无关。 语音如触摸屏,不会被单独提及,当下的新人类不会有按键功能机、触屏智能机的概念。无人车的抽象概念是一种自动化的地面运输能力,几个轮子不重要,轮子的转向方式不重要,是不是轮子都不重要。又何谈当下通常意义的车。 叙事这种技巧,可以寻求表象的共识与认知一致。 当不想寻求普遍意义的认同时,便会放弃讲故事。 ——小气的神 班车随笔0403 关于新生代意大利奢侈品设计师的匠艺 他们把注意力主要放在品牌战略和沟通上,这与第一代的意大利设计师颇为不相同。新生代的设计师更加关注消费者在意义上的追求,寄希望于讲故事和品牌形象识别,并把他们作为设计过程的核心部分。从这一视角来看,他们已经把匠艺明确表达为产品的附加值和灵魂。 小神备注:这与消费主义论述谋和,消费的终极意义在于如何度过更加充实的人生(三浦展)。 关于形式与材料的关系 形式和材料是分不开的——材料承载着形式。 因为当一个物体的材料、材料工艺和形式完全一致的时候,该物体就会在很多层面产生非常真实的共鸣。 人们以非常特殊的方式承认该物体的真实性。 ——Jonathan Ive 关于设计认识论 & 具身认知 学术研究突出人类知识的复杂性,区分了抽象知识、具身知识和分布式知识。认知直接与人类感知的生理体验和结构有关。 现实世界中大多数思维都存在与非常特殊的环境之中,运用于非常现实的目的,并利用与外部促发因素相互作用的可能性或操作外部促发因素的可能性。 理性的心理(基于抽象的表征和正式的规则)与非理性的身体(感觉和体验)之间的分离趋于下降,这种分离恰恰是认知论的特征。 具身认知。我们需要一个身躯去推理思考,这并非平淡或显而易见。理性的结构本身源自我们具身化的细节。要理解理性,我们必须理解我们的视觉系统、运动系统与神经绑定的一般机制等细节。 设计的具身认知概念与社会科学中的情境认知有重叠。情境认知表明知行之间的本质上是不可分离的。认知并非一个抽象的概念,而是一个实际的概念,因为认知发生在于现实世界以及与他人的互动之中,并以社会文化背景为基础。 ——《设计问题》 感觉质 有一个哲学概念为“感觉质”,是指人们通常会按照自己的期待理解客体所包含的意义。柯林·威尔森提出的感觉门控可以来解释。 人的大脑中存在一种机制,使得人们排斥与自我思想相矛盾的其他思想。而这种矛盾思想一旦进入大脑,大脑本身就会崩溃。因此,为了避免发生大脑崩溃,感觉门控这种机制就起到了遮挡、阻断的作用。 也就是说,无论是语言还是作品,作者都无法准确无误地讲自己所要表达的内容传递给读者。因此,作品的目的不是传达,而是“告白和提问”。不仅如此,告白是作品的一种表达,而提问是一种探索追求,这是创作工具具有的两个意义,也是创作的两个目的。总而言之,修辞法不是传达信息的技巧,而是告白的技巧,也是提问的技巧。 ——黑川雅之《设计修辞法》引言部分 - [记](https://mdong.org/2018/03/%e8%ae%b0/): 2018~2020 FOCUS & 迷 - [改变用户行为的设计模型(Presentation)](https://mdong.org/2016/11/%e6%94%b9%e5%8f%98%e7%94%a8%e6%88%b7%e8%a1%8c%e4%b8%ba%e7%9a%84%e8%ae%be%e8%ae%a1%e6%a8%a1%e5%9e%8b%ef%bc%88presstation%ef%bc%89/): 前些时间面向内部做的一次培训课程。 也可能是最后一次吧。 定义、设计人造系统的行为设计,是交互设计的范畴。 认识、理解、改变行为设计,是交互设计师的必备能力。 改变用户⾏为的设计?为什么? 『存在』的探索,身份的焦虑。提升交互职业竞争力的基础课程。 范围界定,从交互设计的研究对象,根本产出物为定义、设计人造系统的行为设计。 ⽤户与环境/设备产⽣交互,建⽴模型以了解⽤户特征。 认知模型、语言模型、输⼊装置模型、⾏为模型。 以⽤户操作行动或任务的执行过程为主线,建⽴的模型被称为行为模型或任务模型。 以行为到动机的关注点变化存在5种典型的行为模型。 TOTE模型、GOMS模型、KLM/TLM模型、卢⽐孔Rubicon模型、TTM模型。 PDF [pdf]http://www.mdong.org/wp-content/uploads/2016/11/DesignForChangeUserBehavior_tengfeidong_11112016.pdf[/pdf] - [夜间模式设计的研究方法](https://mdong.org/2016/11/%e5%a4%9c%e9%97%b4%e6%a8%a1%e5%bc%8f%e8%ae%be%e8%ae%a1%e7%9a%84%e7%a0%94%e7%a9%b6%e6%96%b9%e6%b3%95/): 移动界面设计点滴(4)——为了阳光而设计 六年前,我写了这样一篇短文。 六年后,手上的产品终于做到了一定实践。 看起来,发生了愿景中两个关键设计,适合的灰度与色彩对比度、适合的环境参与。 并将应用在多个产品中,所以分享供研讨。 这组Slideshow的关键内容是,对于竞品夜间模式的总结思路。 ⽬前市面上夜间模式的取色标准,主要基于设计师的主观经验。但落地在产品中的数值确是精确的。那是否存在唯一真相? 下列量化方法可行的前提是,我相信主流设计师的直觉。 所以,通过对设计进行逆向还原、利用模型分析(HSV颜⾊色标准聚类分析、WCAG对⽐比度计算),进行判断。 PDF [pdf]http://www.mdong.org/wp-content/uploads/2016/11/night_mode_design_research_feed_baidu_mobile_browser_ex_201607.pdf[/pdf] - [IXDC2016-前瞻活动-有效的交互设计创新](https://mdong.org/2016/04/ixdc2016-%e5%89%8d%e7%9e%bb%e6%b4%bb%e5%8a%a8-%e6%9c%89%e6%95%88%e7%9a%84%e4%ba%a4%e4%ba%92%e8%ae%be%e8%ae%a1%e5%88%9b%e6%96%b0/): 4月的一个周六下午,参加了这个设计活动。 接到命题的时候,我在湾区休假。讲说的内容也是在此期间断断续续写成的。 对待“创新”,心情非常复杂。开始我用了一个更为激进的阐述方式,后来决定改的柔和。 这个课程其实是准备作为今年团队内部的一个课程。 是关于HCI中用户认知结合交互设计项目管理的内容方向。 你会发现,“创新”这个词,特别是设计师、从事设计工作的人,很喜欢挂在嘴边的口头禅。 创新是什么?工作中,我们会有好多理解。 作为面向消费市场的设计师,我对创新的理解是十分务实的。 这个定义我认为是对的——创新是契合、发掘用户需求,创造性解决问题的方法。 那很关键的一点是,创新不是目的,是手段、是方法。 创新是设计师最喜欢提的概念。 这是不同于工程师。工程设计采用计算、类比法,工作的性质主要是改进、完善而非创新;设计通常意义上,非常讲究原创和独创性,需要丰富的想象、创新能力和前瞻性,而不是严谨、繁琐的逻辑。 我们需要通过创新来体现设计价值,但天然的,创新的结果很难测量。 但这里就有引申出一个误区,因为创新很重要,会有出现为了创新的设计的情况。 而面向市场的项目,为了创新而设计,容易产生过度设计(over-design),是做不到有效的、无益的。 过度设计这个概念,是我刚工作时候,便被反复提醒的事情。 有一些过往很有代表性的例子。 Clear有丰富的手势,完成一个todo,删除一个todo,创建一个todo都是使用各种手势完成。 某个浏览器的手势自定义,大量的手势,甚至还原一个tab需要画一个U型。 某个浏览器,你会发现菜单项,是大量没有文字说明的图形标识。 这几个产品是把设计技术进行了过度使用,手势触发行为的过度使用、图形符号的过度使用。 通常造成这样的直接原因,主要有三个。缺乏专业理论支持、缺乏体验商业价值、缺乏落地可实现性(典型的dribbble们)。 如何避免这些误区,做有效的交互设计创新。在我的理解中,最需要有意识的做过程管理。这又会细分为4个方向。 聚焦改变用户行为的设计。 匹配项目商业诉求。 控制实现成本。 测量创新结果。 因为我们的主题是做交互设计创新,所以接下来看下如何做来改变用户行为的设计。 第一点,其实有个小问题——为什么是关心改变用户行为的设计? 背后一个在工作中反复界定的问题,就是交互设计与视觉设计的区别。 有一个基本原则是,一同对设计体验负责,但交互设计解决行为,视觉设计解决感受。 如果是视觉设计,这里就可以换个词,比如情感化设计。 这里我主要会来引申一个TTM模型,这是美国心理学教授普罗察斯卡(prochaska)提出的,它整合了若干个行为干预模型的基本原则和方法,故又称为行为分阶段转变交叉理论模型。 这个模型的核心观点是,人的行为变化不是一次性的事件,而是一个渐进的和连续的过程。 前意向阶段,人们有了改变行为的意向,处于这个阶段人对结果是不可知、死心。混沌状态。 意向阶段,打算改变、意识到改变成本,但没有实际行动,非常矛盾。典型的拖延症喔- -。 准备阶段,付诸了一些行动步骤。制定计划。 行动阶段,做出了行为改变。但这与最后的行为改变终止不一样termination。 复发阶段,因为各方面的问题,回到了之前的某个阶段。 维持阶段,保持行为并形成习惯。完成行为转变。 我们可以通过刚刚手势自定义的案例来理解这个模型。 这个交互设计的创新初衷是,会带来便利,显然相对于做键盘输入,一个手势的步长很短。 那我们看下,最后这类设计没有普遍使用,究竟出了什么问题。以『Restore Tab』为例。 作为个体用户的你可以反思一下是哪些步骤什么阻止了你使用这些手势。 前意向阶段,我看到这个界面之前,并不知道还可以这样Restore Tab。 意向阶段,因为完成Restore Tab只有一步,也愿意尝试。 准备阶段,准备使用,于是会进行准备记下来,U代表Restore Tab。 行动阶段,我会从设置回去,尝试使用。 复发阶段,误操作的成本回到意向阶段,忘了是U回到了准备阶段。 维持阶段,难以进入维持阶段。 那我们稍微延伸,为什么手势的行为改变容易复发阶段。 这里有一个比较广泛的手势可用性定性测试,显示: 基于首要任务的精准复杂任务,人们愿意使用简单、原始的手势。 比近距离基于手指的手势,人们更愿意使用肢体、基于手的手势。(83%) Finger-based gesture手势设计还有一些特性,类比桌面与手机的手势行为,你会使用手指点击,替代鼠标点击。手指滑动,替代鼠标滚轮。手指拖拽,替代鼠标拖拽。这些行为模型对于你已经建立了很久,本质上也只是一种隐喻。 总而言之,在手机中尝试创建新的手势越来越难。 也可以看到一些成功的手势教育的case。Twitter的下拉刷新。 在我们的产品百度浏览器里,也有类似的创新设计。 需求:大屏幕的点击关闭按钮,精准点击成本高。 解决:选择手势,能够提供更好的便利性。 历程:开始将双指滑动手势,作用于全局的新建、关闭、切换行为。收敛为主功能视图中主要任务的补充关闭行为。始终提供教育(For新用户)。 通过用户行为数据跟踪,与用户访谈,很容易形成用户行为习惯。明确这个目前就是一种有效的创新设计。 创新真的不是一蹴而就,改变用户行为,是渐进与连续的过程。 行为改变在每个阶段,也都有一些特有的方法。 我结合例子来讲3个方法的使用。这个是百度浏览器的K12主题项目。 业务诉求:引导页·提升主题的使用量。 问题:因为内容产量不满足,用户会在没有可用主题的情况下自然跳过。 我们希望改变用户行为,减少内容不满足引起的流失。 这里有一个模型演变对应用户行为改变的过程。 这就是一个引导页,包含已有的主题,以及一个跳过按钮。我们不希望他跳过,用户的跳过的潜台词也是这儿没我需要的主题。 那我们如何改变这个行为,先来分析下这个行为过程。 前意向阶段:可以不跳过,告知可以解决问题。 意向阶段,用户的问题是获取麻烦?使用称为“痛苦减轻”的方法,只要点击那个按钮就可以了!因为完成一件事情只有一步,也愿意尝试。 准备阶段:用户将准备进行点击。用户的问题是点击定位成本高?使用称为“自我决意”的方法,许诺参与互动就会获得想要的主题。 行动阶段:大量的铺垫后,点击一下! 复发阶段:再进来好像也没有变化?使用称为“权变处理”的方法,建立契约,这个也是关联了一个许愿单功能。许愿的主题将被实现! 维持阶段:愿意进来并参与许愿单,改变用户的跳过行为,形成习惯! 最后给留个大家一个小故事,这是我前几天去湾区的飞机上,发生的事情。 Adams是那架飞机的执飞机长,这是他退休前最后一次执飞。在他三万多的飞行历史中,从未折弯过一块金属部件,也未曾使一位乘客受伤,更没有收到过一张飞行罚单。在他四十六年上千万英里的飞行里程中,规避过上千次雷暴,挫败了发动机故障、爆胎、电子设备失效等事故,也因此没有出现在6点的突发报道中。共计运送50万人次的乘客安全达到目的地。他以坚韧和细心保持安全可靠的飞行记录。 其实,蛮荣幸能够经历这样一件事情。也希望自己能够以专业精神,做对人们有益的设计。与大家共勉。 讲说文件如下↓ IXDC2016_北京前瞻_有效的交互设计创新_之改变用户行为的设计_董腾飞_0409_2.pdf[pdf]http://www.mdong.org/wp-content/uploads/2016/04/IXDC2016_北京前瞻_有效的交互设计创新_之改变用户行为的设计_董腾飞_0409_2.pdf[/pdf] IXDC官方新闻稿《腾讯、百度、滴滴资深设计师为你解读移动产品的交互设计创新》 IXDC官方新闻稿《有效的交互设计创新之改变用户行为的设计—大会前瞻论坛北京站精彩回顾》 - [[译文]为儿童设计网页(Design Web Interfaces For Kids)](https://mdong.org/2015/11/%e8%af%91%e6%96%87%e4%b8%ba%e5%84%bf%e7%ab%a5%e8%ae%be%e8%ae%a1%e7%bd%91%e9%a1%b5%ef%bc%88design-web-interfaces-for-kids%ef%bc%89/): 译者:MUX翻译小组(雷昊 小气的神) 孩子们会花大量时间上网,但是认知和生理局限会在他们上网的时候给他们带来很多挑战。再加上粗糙设计的内容和暗模式,真是糟糕。作为网页设计师,我们有责任创造出帮助儿童提高能力的事物,让他们变得更聪明,而不是相反方面。 这篇文章将会给你一些观点,关于从心理学角度分析孩子们喜欢什么,以及这些是如何影响他们使用网页的。我们还会讲到一些实用的设计指南,来为儿童设计更好的网页。 范式转移 1989年3月12日,第一个互联网浏览器Mosaic诞生了,实质上这标志着我们所知道的互联网的诞生。这一天之所以如此重要,是因为这种“普通人”互联网的诞生代表着一种范式的终结和另一种范式的开始。没有互联网作为信息和娱乐的主要来源,在这种环境中成长,我们与如今的孩子相比是处在完全不同的另一种范式。 前互联网范式 我们生活在一个没有互联网的模拟计算机范式时代。回到高中时期(1995年至1998年)我清晰的记得我在学校和公共图书馆寻找我能用在学习中的好书。 回到模拟范式,我们非常依赖书籍作为信息来源。(图片来源:Les Chatfield) 我们在某个动作发生时对时间的控制,构建了我们的心智模型,就像从书桌走到书柜一样。我们可以选择走得快些或走得慢些。归根结底,我们可以控制时间。这也可以解释为什么我们中的很多人会在网站内容加载很慢时如此的不耐烦。我们的大脑记得事情在掌控中的样子,因而不喜欢在网站中那种无法控制的感觉。 互联网范式 对于生来就使用互联网作为主要信息来源的这一代人,他们在认知时间控制概念的时候拥有不同的心智模型。他们知道一个网站会尽可能快的加载,但无法再进一步人为干预它。他们知道一个动作发生时长的不可控。 对此我做了一些课题,观察孩子们使用电脑。如果加载的慢了,大部分孩子会同时做一些别的事情—如果周围有电视他们会看电视,或者在社交场合下和他们旁边的孩子交谈。 前不久,我帮助我七岁的孩子在他的电脑上安装谷歌地球。它下载了很久,我记得由于不能忍受它如此之慢而离开了房间。而他只是打开了电视开始看卡通片,然后当下载完成时叫我回来。 “数字土著(Digital Native)”不存在 我不相信有“数字土著”。当然,孩子的成长伴随着iPad、智能手机和电脑,但那不意味着他们自然而然变成了使用数码产品的专家。事实上恰恰相反。 一个iPad(或者其他平板电脑)是一个封闭局限的环境,孩子们不会制造太多危害(除了买很多蓝精灵果和删除照片),同样这也没有教会他们任何关于技术如何运作、计算机如何运行和如何运用技术创造新事物的本领。 (图片来源:Brad Flickinger) 用着iPad长大并没有使孩子能够使用和理解计算机,或者互联网。 尽管怀疑“数字土著”,但我认为事实上孩子们生活在一个不同的范式下,对他们与网页的交互方式和对网页的认知方式上有很大的影响。从小在一个触屏的环境中玩耍,会很大程度上影响到他们的心智模型。(我们回到这一点上。) 另外,他们是小孩。他们没有像大人一样充分开发大脑和身体技能。所以,当我们为他们设计的时候我们需要换个角度思考。 - [我的困境](https://mdong.org/2015/07/%e6%88%91%e7%9a%84%e5%9b%b0%e5%a2%83/): This content is password protected. To view it please enter your password below: Password: - [IXDC2015-WorkShop-B3-移动产品UX设计思考与实践(SRBP模型)](https://mdong.org/2015/07/ixdc2015-workshop-b3-%e7%a7%bb%e5%8a%a8%e4%ba%a7%e5%93%81ux%e8%ae%be%e8%ae%a1%e6%80%9d%e8%80%83%e4%b8%8e%e5%ae%9e%e8%b7%b5%ef%bc%88srbp%e6%a8%a1%e5%9e%8b%ef%bc%89/): 今年参加了IXDC2015的WorkShop主讲,7月16日下午的活动,主要内容是讲解一种全局思考IXD工作的方法。 介绍一种结果导向的工作方法,帮助设计师与管理人员由新的视角认知设计,厘清设计工作的重心与执行方法。助于设计职能更有效的与团队协作、实现良性成长。 目前终于暂时告一段落,一件心事落定。 从春节前开始,经过部门内报名、筛选,然后着手具体的内容编纂,重写反复修改,新项目入案例…… 现场有些遗憾,希望再次能够从容。 下面是几个主要的PDF格式的PPT文档链接,供需要的同学取阅。 官方新闻稿 WorkShop的主体文档 IXDC2015_B3_移动产品UX设计思考与实践_董腾飞_小气的神_0716.pdf(100P+) [pdf]https://mdong.org/ixdc/IXDC2015_B3_移动产品UX设计思考与实践_董腾飞_小气的神_0716.pdf[/pdf] SRBP模型地图V1.0[pdf height=”352px”]https://mdong.org/ixdc/goto/srbp_map_blank_cn_v1.0.pdf[/pdf] SRBP模型地图V1.0 & 范例内容[pdf height=”352px”]https://mdong.org/ixdc/goto/srbp_map_cn_v1.0.pdf[/pdf] 方法概念 SRBP模型是一种通用设计方法论,用以认知设计对象,并辅助建立系统的执行方法。 SRBP是4个名词的首字母缩写,分别代表Solid(有效)、Revolution(革命)、Break(突破)、Professional(专业)。 核心理念 展现设计视角与设计价值,结果导向的设计行为决策思维。 判断因素 1. 重要性(KPI/OKR、BOSS) 2. 耗时(1/2Q为原点) 3. 行为定义(主/被动、外/内向) 4. 工作方法(适合的方法论) - [大屏手机时代,如何重塑界面交互](https://mdong.org/2014/12/%e5%a4%a7%e5%b1%8f%e6%89%8b%e6%9c%ba%e6%97%b6%e4%bb%a3%ef%bc%8c%e5%a6%82%e4%bd%95%e9%87%8d%e5%a1%91%e7%95%8c%e9%9d%a2%e4%ba%a4%e4%ba%92/): 12.30.2014 约稿于百度MUX新官网上线 这是一个大屏手机的时代。 强调这件事情的意义在于,这已经成为事实。 Medium上存在一份个人统计。 在过去7年,新上市的手机屏幕尺寸越来越大。 以4.5英寸为分界点,我们更清晰的看到这一变化。过去的两年,4.5英寸的比例从10%升至80%。 在国内的过去3个季度,使用FHD HD分辨率的手机从38%的份额增至50%。 【图】《百度移动分发报告2014H1》 更大尺寸的屏幕可以承载更多的内容展现,更适合游戏、阅读与播放视频,体验得以提升。 【图】《百度移动趋势报告2014Q2》 然而屏幕尺寸的上升并没有引起用户操作上的过多不适,有51%的用户已经适应双手操作。 【图】《How Do Users Really Hold Mobile Devices》by Steven Hoober 即使用户单手操作,在操作大屏幕时的相对盲区(深色区域),需要更多的响应时间,也可以被接受。 【图】《Mobile UI ergonomics: How hard is it really to tap different areas of your phone interface?》By Mikkel Bo 即便如此。3.5英寸~4英寸,依然是平衡单手操作与体验的合理尺寸范围。 这样就产生一个矛盾:用户拥有更大屏幕的尺寸,但从人机交互的角度,并不完美。 面对这一现状,从APP产品界面设计的角度,需要做出改变。 大屏幕拥有典型的可用性问题:纵向单手操作机身,边角、顶部、左右侧边难以触达,放置在以上盲区的点击入口,将导致体验路径中断。 交互设计角度的最佳实践: 1.设计安全区域,避开操作盲区。 示例,百度搜索结果页,根据视线规律,典型的左上角操作盲区可以用于logo展现。 2.注意使用场景路径触发的连贯性。 示例,在百度手机助手Android中下载百度浏览器,操作区域集中在安全区域。 3.更多的使用可拖动的浮动按钮,给用户更自由的操作可能性。 示例,百度浏览器Android中翻页/返回顶部的组合按钮。 4.更多的使用手势,并提供暗示。 示例,百度浏览器Android的删除窗口操作。 5.更多的使用语音作为输入方式。 示例:生活手记中使用语音替代键盘输入。 6. 横屏Pad化的操作设计,以及更多的内容展现。 示例,百度浏览器iPhone的横屏设计,如同网页的Responsive Layout概念。 在界面交互的层面之外,在不远的时间,硬件存在更多的优化可能性。 1.更窄的边框,更大的显示比例。 2.柔性材质。 3.“手机”成为服务的触发者,屏幕投射与隔空操作。 《The World as a Display》 之所以将讨论的范围扩展到硬件,是希望设计师在针对具体屏幕设计的同时,能够从另外的视角,思考人机交互的变化与可能性,激发创造力。 当前是大屏手机的时代,推动你的手机APP产品跟进吧! 一些有价值的相关基础研究链接 百度移动分发报告2014H1 百度移动互联网发展趋势报告2014Q2 The Rise of the Phablet: Designing for Larger Phones Common Misconceptions About Touch How to design for thumbs in the era of huge screens Designing for […] - [为什么去“设计”?](https://mdong.org/2014/11/%e4%b8%ba%e4%bb%80%e4%b9%88%e5%8e%bb%e8%ae%be%e8%ae%a1%ef%bc%9f/): 纸面速写《迎着光,静止》 它是否在激发你的灵感?开始一项生意?设计一个产品?改善一个想法?它是否使得你去改变与模仿?它激发你旅行?或生活在一个另外的城市或者国家? 你是否需要某个人同样去告诉你,你的产品/想法/执行/品牌是如何伟大?我们说不要担心别人如何想,相信你自己的判断。当其他人怀疑时,坚持你的信念。停止等待最好的时间去做你想做的事情。只需要向它而去并且立刻去做。 不要追随潮流趋势。你可以碰触到最酷的事情是做自己。在世界中旅行,在其它城市生活,学习不同的文化。学习,可以保持你的思想年轻。身份的焦虑,不要因此抱怨。 但是你对于你需要做的事情要心存愿景、坚持与自信。 如果你的工作真糟糕,不要责备其他人,你的老板、你的父母、世界。只是退出,并为自己的选择负责。这并不关乎一个糟糕的工作,而是关乎你进入到了一个错误的地方,你将变成什么样的人。 开始做近些年随时光溜走的想法,承担风险。相信你的感受。直觉是可靠的。 坚韧与集中精力在执行,不管开始是如何让人气馁。自信你所做的事情,即使有别人的怀疑。 为自己创造机会,这正是进步的时间。 The coolest thing you can do is doing it. – Bill Tikos (TCH) - [The Continent](https://mdong.org/2014/08/the-continent/): 2014.7 at Qinghai 是彼此的过客 后会无期 - [软技能-非职权影响力](https://mdong.org/2014/05/%e9%9d%9e%e8%81%8c%e6%9d%83%e5%bd%b1%e5%93%8d%e5%8a%9b/): 最近在上一些内训课程,做些简单总结。 重点:影响力概念、策略、5种不同的影响力方式。 概念:通过积极有效的沟通,权衡任务和关系,已达成目标的能力。 过程: 目标:主目标、次目标 策略:时间、地点、对象、方式 行动 方式: 果敢表达 有力说服 融合共赢 鼓舞激励 洞察感知 方式转换的情况: 事态停滞不前 事态发展与目标越来越远 对方情绪变化 对方肢体语言变化 变速箱模型(Influencing Gear-box Model) 模型的关键在于:影响他人最有效的方法是通过“洞察感知”洞察情景变化与对方反应,适时转换影响方式,以达成目标。 一些继续体会的点: 你教会别人如何对待你。 向外看的人在做梦, 向内看的人将觉醒。 - [beego logo](https://mdong.org/2014/03/beego-logo-%e8%ae%be%e8%ae%a1/): I was invented to redesign beego logo last year. Beego is a HTTP framework for developing Go applications rapidly. It can be used for developing API, Web app and backend services quickly. It is a RESTful framework. It is inspired by tornado, sinatra and flask and has integrated some Go features such as interface, struct embeddedness. finally we decide to use the first style which combine “beego” text and bee shape. - [llolli 1.0 release](https://mdong.org/2013/09/llolli-1-0-release/): We release llolli 1.0. Designer 小气的神. Llolli is a todo & calendar app. Designed with love, Llolli is a new experience that will make your life easier. Features • Fast to create todo use text, voice, photo. • Fast to transform between todo and calendar. • Suggesting you with color base on current todo list. • Compatible only with Google Calendar for now. • Reminders. • A completely redesigned calendar experience for your iPhone. • Support browse calendar by day, week. Download from AppStore 关于这个设计,还有一个很美好的经历。 有一天收到Vivian的信,那是一封《一个关于你的梦》。 穿越时空 🙂 在梦里,我和其他同学是一群进到了一座木头做的高塔春游的孩子。 这座高塔非常大,木板老旧,黑黑的,但十分结实。每一层都有很不一样的风景,住着非常不一样的人。 最初我们在顶层,并且我知道我们将要一路下到底层。 顶层是类似旅游景点的购物中心,非常喧闹拥挤,我挤到一家杂货店门口,门前挂着各种帽子和一串串的各式杯子。(因为在现实生活中我一直想买一个便宜的瓷杯子的缘故)我一眼看到了一个3刀的杯子,心花怒放。刚准备买,此时听到我朋友使劲喊我,快走快走,来不及了!(虽然我也不知道来不及什么) 没来得及付钱,而且我头上还戴着一顶刚刚试戴的帽子,蓝色的蓝猫造型的帽子丑得非常诡异,而他已经拉着我的手开始在人群中狂奔(就像千与千寻里面的白拉着小千飞奔)。 我们一路经过黑暗的甬道,坐过旋转的滑梯,下过陡峭的楼梯,跳过吓人的裂缝。由于梦没有逻辑的缘故,路上我突然得知,小神,你是我这个朋友的亲戚。他说,你不是一直想找他么,我经常去他家的,带你直接去见他好了!他住在塔的八层。 于是终于一切宁静缓和下来。这一层没有人,静静的地面上有绿植和苔藓。听得到水滴的声音。远远的石板路上还能看到各种牌匾,正对着的一个写着“鹅”字的牌匾下,是养鹅的棚子。对,这里我来过,有一点印象。那还是久远之前的另一个梦里的事情了。 黑乎乎的角落里,门缝中漏出一丝光线来,那就是你家了。我还在犹豫该如何敲门,朋友就已经大大咧咧直接掰开了门,对里面叫到,嘿,小神,我们来了。 里面是日式结构,榻榻米上的茶几围坐着好几个人呢,你们起身迎接我朋友,我跟进来的时候不由得害羞地捂住了脸。要做不速之客了呢,而且还是要跟小神说这么令人感到脸红的事情。 在梦里,你穿着一身黑衣服,头发不短,看上去很友善。(有点浦原喜助的赶脚)你笑着问我,有什么问题可以帮我解答呢?我拐着弯说:“在设计里面,借鉴和抄袭的界限是什么呀?” 你笑笑地说,“没那么清晰,可能你觉得是就是吧。” 于是我就很不好意思的说了我借鉴了你棒棒糖设计的这件事,然后你很大度地说:“没有关系呀,很高兴你喜欢~” […] - [梦旅程](https://mdong.org/2013/07/%e6%a2%a6%e6%97%85%e7%a8%8b/): This content is password protected. To view it please enter your password below: Password: - [用Photoshop/Fireworks创建9PNG图像](https://mdong.org/2013/03/%e7%94%a8photoshopfireworks%e5%88%9b%e5%bb%ba9png%e5%9b%be%e5%83%8f/): This content is password protected. To view it please enter your password below: Password: - [Heartbeats](https://mdong.org/2012/11/heartbeats/): This content is password protected. To view it please enter your password below: Password: - [Hedgehog's Dilemma](https://mdong.org/2012/05/hedgehogs-dilemma/): This content is password protected. To view it please enter your password below: Password: - [好玩的书 for new iPad release](https://mdong.org/2012/04/%e5%a5%bd%e7%8e%a9%e7%9a%84%e4%b9%a6-for-new-ipad-release/): This content is password protected. To view it please enter your password below: Password: - [Letao-iPad客户端视觉设计探索](https://mdong.org/2012/03/letao-ipad%e5%ae%a2%e6%88%b7%e7%ab%af%e8%a7%86%e8%a7%89%e8%ae%be%e8%ae%a1%e6%8e%a2%e7%b4%a2/): This content is password protected. To view it please enter your password below: Password: - [milk香港版——瓦尔登湖的语](https://mdong.org/2012/03/milk%e9%a6%99%e6%b8%af%e7%89%88-%e7%93%a6%e5%b0%94%e7%99%bb%e6%b9%96%e7%9a%84%e8%af%ad/): 我们被迫生活得这样周到和认真,崇奉自己的生活,而否定变革的可能。……可是从圆心可以画出多少条半径来,而生活方式就有这样的多。一切变革,都是值得思考的奇迹。 ——《瓦尔登湖》 不想这样结束,但真的结束了。 ———— 很荣幸,在这个移动应用市场的早期,全程handle的产品设计。 很荣幸,在没有marketing资源推动的日子,依然收到的三方媒体社区用心点评: Softonic MILK香港版电子刊物 http://milk-hk-ios.softonic.cn/iphone Tech2IPO HT实验室:做“走出去”的设计之Milk评测 http://tech2ipo.com/44460/ 特别想记下milk当家总监kabo长期给予的耐心与支持。对于一款阅读产品,产品设计与品牌内容资源同样重要。 ———— There is no time。还是要几个产品碎片留下⋯⋯ 无间 很想让使用它的人也知道,我们传达信息间的连贯与流畅。这种意愿的传递,不再只停留在静态。 在内容视图里,标题与内容将通过带有金属气息的线条分割,箭头标示了两者的层级关系。 切换视图的状态,银色箭头跟随标题长度居中的运动场景与开合方向,指引信息间的关联。 不孤独。 冰山 呼吸的节奏 回归平静,在睡前,在感受呼吸的背影间。 一直在你身边 献给这个产品过程、产品开发团队与milk同事。 尤存。 - [旁白网pangbai.com-发布](https://mdong.org/2012/03/%e6%97%81%e7%99%bd%e7%bd%91pangbai-com-%e9%a2%84%e5%8f%91%e5%b8%83/): 旁白pangbai.com 用设计打动生活,为你带来灵感、乐趣和完美的购物体验 新浪微博 腾讯微博 点点网 嘻嘻 好久没有release webpage设计。 已正式上线。 - [Following the sun](https://mdong.org/2012/02/following-the-sun/): This content is password protected. To view it please enter your password below: Password: - [Windows Phone app的设计过程](https://mdong.org/2012/01/windows-phone-app%e7%9a%84%e8%ae%be%e8%ae%a1%e8%bf%87%e7%a8%8b/): 原文http://ux.artu.tv/?p=192 译文http://www.mdong.org/?p=2232 译者注: 原文的作者为Windows Phone Design Studio的设计师,虽然话语啰嗦,但是能够感受到许多Windows Phone设计完善过程中的细节。重要的一释疑是业内对Windows Phone开发环境封闭的以讹传讹,至少从app设计角度,Windows Phone的心态是开放的。并致力于提升产品创造的团队效率。思维方式不限于Windows Phone,同样适用于其它平台的产品参与者。 — 这里有一个我在使用的Windows Phone app的设计过程。其中许多设计过程阶段是传统的,我尝试从Windows Phone app特别的视角来阐释。 这篇文章是关于end-to-end的过程,所以会保持其高视角,并在下面的文章里详细的探索每一个步骤。比如,下周我们会从理念与概念开始,关于讲故事(storytelling)、草图(Sketching)、故事板(storyboard)与低保真原型(low fidelity prototype)。这篇文章会是系列内容的轴线。但是并不确定会不会基于反馈重新定义(refine)某些阶段,以及增加更多的示例。 图表自下向上读…… Windows Phone设计过程与其它的网站、移动app或任何设计没有本质不同。所有的设计师重视设计过程,用他们自有的方式调整、完善设计,并改变适用于每一个项目。没有项目是相同的,因此非常重要的是以指南(guidelines)理解设计过程而不是规则(rules)。保持灵活性(flexible)。 理解“设计”,设计不是按快门(one-shot)这类活动。你不能凭借一次尝试既确定设计,而是像创作雕塑作品,有一个迭代过程。艺术家拿到一组大理石,他们不会从细节开始,如眉毛、指甲或者头发。而是第一步先塑造整体的感觉,主要的体感与大块。接着第二步定义更多的特性区块,如手臂、胸、头与腿。随后有第三步、第四部与第五步。达到刻画小细节的程度需要经过许多步骤。用户体验设计同理。你不能从细节开始,最终会让你自食其果。应用程序流程(Application Flow)需要在视觉设计(Visual Design)前定义。我看到过许多类似事情的发生,他们尝试跳过一些步骤走捷径,而缺乏设计探索(design exploration)最终得到的是随后项目中的暴怒。 应用主题(App Theme) 我们从应用主题开始。这个是第一个可能产生分歧的点。我只是知道应用主题对于创建接下来的阶段非常重要。我注意到当开始app设计过程我们通常有两个选择。1,已经有一个我们想做的、非常清晰的idea;2,我们有一个目标,基于现有的API与Web Service。但两个途径在我看来都是错的。如果你有一个清晰的idea,你知道你决定了自己与团队的解决方案,但还没有通过探索验证。如果你决定创建一个app基于现有的API或者Web Service,你会最变成另外一个Twitter、Yelp!或者Foursquare 客户端或者另一个从Yahoo获取数据的股票软件!金融或者另外一个从CNN获得内的RSS聚合器……从Marketplace上搜索CNN你就知道我正在说什么。即使这些app有好的体验。相信我,他们无法突围或者为用户做出贡献。不要想APIs或者RSS Feeds。想想用户体验。所以替代的思路是”哇哦……CNN的RSS Feed是可用利用的“ ”我们如何为用户在获得最新与关联且重要的新闻的体验做出贡献?”尽快思考这些,越早为自己与团队打开一个新世界的探索。不再是RSS阅读器,现在你有一个更高的目标,史诗般的任务来帮助用户获得更多关联且重要的新闻。因为对象是宽广的,解决方案是不具体的,这才是想要的点。你保持开放,所以你会探索并拥有革新的idea。替代基于APIs的思考,而基于体验思考,如跑步体验、进餐体验、航行体验,询问自己与团队,你如何为你的用户做出贡献提升体验。注意这并不是必要地意味着解决全部的体验……它意味着只是解决X或Y部分的体验,用户趋向难以发现的地方或者你看到一个机会可以帮助用户发挥全部潜能。在随后的开发过程中,你会选择你会选择API或RSS Feed从任何源,但是起点一定不是技术解决方案。最流行的Twitter或Foursquare客户端都是成功的因为它们将体验放在第一位——而不是API。 现在如果你已经有客户端的app服务于特定的产品服务,或你正在移植iPhone或Android app到Windows Phone,请做好准备,针对主题进行重新定义(refine)。在许多的情况下,受制于预算或委托人,你需要直接跳到信息架构(Information architecture)阶段。然而真诚地说,即便由委托人雇佣你移植一个iPhone/Android app到Windows Phone,请依然做好主题、理念与信息架构的重定义准备。事实上这不是一个坏消息,一旦你进入了信息架构与交互设计(Interation Design)阶段,会得到最好的Metro设计语言:Pivots、Panoramas、App Bar、List View、Typography、布局与动画。当从其它平台移植app,你的工作会变成:1,理解这些平台上的当前信息架构,并用Metro翻译它们到正确的屏幕、内容视图与导航。基本的事情是理解当从iPhone与Android迁移时,你不能迁移UI。你迁移的信息架构。通过思考与实践,你会预防错误的转化过程……如当人们尝试从iPhone迁移返回按钮(通常是屏幕左上角的按钮)到Windows Phone……你在Windows Phone上不需要一个屏幕上的返回按钮,因为我们有一个硬件的返回按钮。所以,遵循思考“迁移IA”比“迁移UI”要更合适。 理念与概念(Ideation & Concept) 现在你有一个主题或者任务,到了为其产生idea的时间~理念与概念阶段非常有趣!——就像是在玩游戏。头脑风暴(Brain storming)的游戏,草图游戏讲与讲故事的游戏。在这个部分有三个关键阶段:1,头脑风暴;2,探索;3,合并(Consolidation)。概况来说,在头脑风暴阶段你产生了大量的idea,在探索阶段你详细分析与研究许多idea(但不是全部),在合并阶段你决定哪些idea会继续向前变成app一部分。只有少数的idea会存活。 完全自由的头脑风暴 这个阶段的目标是产生关联任务的大量idea,如“贡献酒店预订的体验”。想象力(Imagination)、妄想(delusion)与古怪(craziness)是在这个点上都是好的技巧。让自己有玩的心态,思路跳出思维框架。有需多具体的头脑风暴练习如Subject+Verbs+Objects与扩展思路的Alternate Worlds、Impossible Scenarios与In Other‘s Shoes。我们会在下一篇文章讨论所提到的技术。这些游戏你可以与团队一起参与,如果你是独立开发者你可以跟朋友一起参与。这个阶段的目标不是强迫你疑虑“你如何build或编写这个或那个”。也不是关于这些东东长什么样。它是关于产生idea的。在接下来的几个阶段,这些idea会落地执行。后面,就像我们知道的,有百万个非常好的idea,但是只有一个或者两个会被恰当执行,并且成功。 探索分析/审查/测试(Exploration Dissect/Inspect/Test Ideas) 在探索阶段你会得到头脑风暴中脱颖而出的idea,并需要了解更多关于这些idea的内容。你可以通过分析、审查与测试来达到目的。这个点idea刚刚出生,它们就是孩子,没有完全的发展或成熟。然而这些idea只是头脑风暴的一部分,也许许多疯狂的idea在头脑风暴过程中已经灭了——但是有一些依然存在。你可以肯定会发现你或团队中其它人会坚信、接受并深深爱上这些idea——他们的孩子。我冒险地说这不是好事情,但同时,你需要爱上已经确定的idea,这样你就可以把其它idea推得远远儿的。有些时候idea需要发展来完全的证明。如果你太快地放弃了一个idea,也许你会失去一个好的机会。幸运的是这个阶段我们有4个非常有用的工具,允许我们探索我们的idea并发现优秀的种子:草图、故事板、简易原型与讲故事。这些工具帮助开发人员与设计人员针对idea进行测试。 拥有草图能力可以帮助你维持更多的抽象概念。故事板可以帮助你像接近皮克斯或梦工厂动画师一样讲故事。你使用手绘与故事板展现idea的用户体验情景,如何通过app来提供帮助与做出贡献。这是一个可视化的方式。原型是一个全新世界可以探索,当前重心在简易原型。这里有几种方式:一个是通过纸张、便条、卡片与胶带建立模拟原型。你可以通过手动粘贴到画布上测试情景(scenarios) 来传达交互。这类简易模型需要一个向导与测试用户。这听起来像是落伍的活动。但是它真的不是……它是非常严肃的。你会惊讶,你能在一张简易原型上用15~60分钟而不需要花一分钱,就可以收到许多反馈。在进一级的设计过程阶段不会使用简易原型,但在这个点,这是最佳选择。另外一个做简易原型的方式是使用Expression Blend(或者是Powerpoint或者其它的交互工具)。这个是Design Studio的Jared Potter第一次向我展示的复合数模技术。简单的说,你在纸上画草图、拍照、载入图像到Expression Blend,在头部的可点击区域增加透明按钮并关联导航栏。Done!他称这个是15分钟简易原型技术,我们会在下一篇文章中讲得更多。 整合产生决策 (Consolidation Make Decisions) 从头脑风暴开始得到许多idea,经历自己与团队的探索……在这里需要整合,非常好的idea会脱颖而出。这是一个决定哪一个idea会进入app的过程。有不同的练习会帮助你的团队缩减列表与基于优先级排序列表。这里的目标是移除尽可能多的不明确信息。这时,idea比起概念阶段进一步进化,并引发更多的用户情景(user scenarios)或者信息情景(information scenarios)。你需要带到下一个阶段的是一个基于优先级的情景列表。 信息架构(Information Architecture) 信息架构阶段的目标是定义信息、任务与彼此之间的关系。用户所拥有的数字体验:信息与信息利用的潜力——使用信息来帮助决策、获得关于某些事情的知识、产生信息。 信息架构是一个完整的学科。信息架构的目标是制定信息规则。 在理念与概念阶段产生的用户情景包括不定型的信息,如名字、日期、价格、图像、温度范围-在信息架构阶段你会带着不定型的信息并传递为结构化的信息。一次尝试是不可能完成的,它需要经历多个过程。 我们有两个非常有用的工具可以帮助我们定义信息框架:应用程序流程表单(Application Flow charts)与低保真原型(Low Fidelity Prototyping)。 所以在信息架构进行第一次尝试,并通过创建Flow charts进行测试。这里有不同成熟度等级,主要是从任务流程到具体屏幕+内容视图+导航表单。记得经典软件工程的Flow charts吗?这就是app flow charts,它只是一个可视化术语,我们专注在用户流程(user flow)、体验(experience)与交互设计(Interaction design)。一旦你拿到一个flow chart,你就可以尝试讲述用户情景(user scenarios)的故事。你会获得反馈与idea,用来重定义信息架构,并返回完善AI文档。这时你可以反复通过创建较高仿真的flow chart进行测试。flow charts渐渐地变得详细,从简单的任务flow到屏幕展示内容视图、导航。我不称之为高端的flow charts线框图(wireframes),确切的说是低保真框架。 另外一个工具是低保真原型(low fidelity […] - [(译)Windows Phone中环绕icon的圆圈](https://mdong.org/2012/01/%e8%af%91windows-phone%e4%b8%ad%e7%8e%af%e7%bb%95icon%e7%9a%84%e5%9c%86%e5%9c%88/): 原文http://ux.artu.tv/?p=176 译文http://www.mdong.org/?p=2214 在Stockholm的Windows Phone Design Day期间的Q&A环节,Stockholm本地的交互设计师Petter Sifver提了一个问题,关于Windows Phone app bar上的icon,想知道为什么icon的周围会有圆圈。Petter友好地在其博客上为分享了他围绕设计阐述的观点。 — 我们看到的是Button,而不是icon。——从字面上。在这些Button内部都有小icon。微软提供的开箱即用(out-of-the-box)的Metro设计语言有一致性接近“button like”(可意会的按钮)控件。不论它是一个Push Button, Toggle Button, Command Button或者媒体播放Buttons或者icon button——button在Windows Phone的Metro语言里有一个边框,来定义边界。所以icon buttons在app bar是朴素地遵循了同样的语言——我理解它们可能造成困惑的原因是,我注意到当我们谈论icon时,我们会经常表述在圆圈里的内容并称它们是icons。当我们谈论icon我们会表述它们像icon(没有圆圈——即便如此,99%的它们被当icon buttons来使用)。 Saliency概念是正确的,而在我们的Metro button设计语言中有例外设计。 这样做是在保持一致性。称呼它们button或icon从字面看起来很接近,但是有着非常大的区别。我们使用button用来交互,使用icon传达一个单项的信息。例如,在电话应用在call history list界面中紧挨着calls使用带有电话icon的button——它们是button,不是icon。 另外一个使用icon buttons例子是在文字消息应用——当你希望增加一个新的联系人并发送一条文字消息,你得到一个带有加号icon的小button,同样的,它是一个button——不只是一个icon。你会发现我们不会使用icon作为button。它已经通过加号icon吸引了人去使用——我知道我被建议了。回到开始,正确的接近windows Phone的Metro设计是使用icon button。 现在我们看一下我们如何使用icon。例如在状态栏中,它们是确确实实的通知icon,并且没有使用圆圈(它们不是button)。 我们使用icon做为图形,它们提供给用户单项的信息(它们是不可交互的,因此不是button)。例如在电子邮件应用我们使用小icon(不是button)与用户交流。当有附件在一封邮件里,这时它会成为高优先级邮件(标记)。 所有这些,我希望明确,我们在Windows Phone Design Day所谈轮到——Metro在做两件事情:Metro设计法则与Metro设计语言。Metro法则是设计支撑。Metro设计语言建立在法则之上,是在实体UI元素、动画、排版、构图与其它交互方向中的证明途径。 Metro设计语言由三件事情所定义:Windows Phone的native应用(邮箱应用、文字消息应用、people hub、本地搜索等等);第二,Windows Phone UX Guidelines;第三,控件库与其它Windows Phone SDK & Silverlight Toolkit的可用资源(所有的三项彼此之间会保持一致性)。开发人员与设计人员可以使用Metro设计语言,这会成功地为Windows Phone建立精巧美观、引人注目与一致性的体验。 Metro法则是优先的,它凌驾于任何语言,所以设计人员可用自由的探索法则,并且通过非主流的方式被你所证明。我们也乐意看到这些事情发生。Metro原则允许无限的探索与进化。这里我们给一些思路…从Swiss Design Style的课程中读一些文章。这描述了许多Swiss设计背后的理念(Metro的根源在它,也可以称为International Typographic Style)——阅读其中的海报与印刷媒体设计。然而,许多这些海报、设计与Metro设计语言并不相像,但是这不意味着做为一个设计人员不能探索其它的表达法则的途径。 - [产品创造过程中经历的三个角色](https://mdong.org/2012/01/%e4%ba%a7%e5%93%81%e5%88%9b%e9%80%a0%e8%bf%87%e7%a8%8b%e4%b8%ad%e7%bb%8f%e5%8e%86%e7%9a%84%e4%b8%89%e4%b8%aa%e8%a7%92%e8%89%b2/): This content is password protected. To view it please enter your password below: Password: - [那個下午 離妳最近](https://mdong.org/2011/12/%e9%82%a3%e4%b8%aa%e4%b8%8b%e5%8d%88-%e7%a6%bb%e4%bd%a0%e6%9c%80%e8%bf%91/): This content is password protected. To view it please enter your password below: Password: - [NUI自然用户界面(Natural User Interface)](https://mdong.org/2011/12/natural-user-interface-nui%e8%87%aa%e7%84%b6%e7%94%a8%e6%88%b7%e7%95%8c%e9%9d%a2/): NUI不是一个新名词。 只是经历近年的一些新产品,有了更贴切的感受。 特别是消费电子终端界面CLI、GUI、NUI的变化。在桌面端,对象通常是显示固定的屏幕,设计师专注于键鼠驱动下的视觉效果。到了移动端,拥有更多传感器与交互方式,便携使得移动设备不限时空,传统专注于固定场景与操作的设计思路不合时宜。 NUI的概念恰好触碰到这一变化(并不局限于消费移动设备)。 设计亦不存在创新,只是发现。 社区 http://nuigroup.com/forums Wikipedia NUI定义 http://en.wikipedia.org/wiki/Natural_User_Interface 自然用户界面自然在哪儿 http://blog.sina.com.cn/s/blog_4caedc7a0102dzpk.html NUI视频集(proxy)http://vimeo.com/channels/nui 概念 “自然用户界面”(NUI)是下一个的人机交互(MMI/HCI)的模式转变。基于传统的人类本能的交互模式,如触觉、视觉、声音、运动和较高的认知功能,如表达、理解和记忆。自然用户界面的目的,是利用了一种沟通方式,更广泛的权力,利用有广泛技能的人才,通过传统的物理相互作用收益。 笔记 作为一个学科;NUI目标在于探索研究受到自然启发的计算技术,另一层面,尝试根据信息处理与交互模型理解我们周围的世界。通过它们的学习我们复制真实世界的环境,利用新兴科技与传感技术,获得在物理与数字客体间更精确与优化的交互。 从经验来定义自然交互:人们自然地沟通是经由手势、表情、运动,通过观察与操作物理客体来探索世界;主要假设是他们应该被允许与技术的交互,如同与日常真实世界的交互。自然用户界面的特色是一种新的建筑美学,关于如何在物理空间伴随人类感官,迁移计算到真实世界、创建沉浸式体验。 Shneiderman(1983)解释了用户控制的核心思想,包括: 可视的客体与操作 迅速的、可逆的、渐增操作 通过直接、使人感兴趣的可视化操作,替代复杂的命令语言语法 相关的关键字与领域 Open Source 开源 Cognitive Science 认知科学 Human Computer Interaction 人机交互 Computer Vision 计算机视觉 Linguistics 语言学 Multi-Touch 多点触控 Design (…) 设计 Artificial Intelligence 人工智能 Brain Hacks Human Factors 人机工程 Interaction Design 交互设计 Usability 可用性 Information Visualization 信息可视化 DIY (Do it yourself) DIT (Do it together) Psychology 心理学 Philosophy 哲学 Physics 物理学 Natural Computation (http://en.wikipedia.org/wiki/Natural_computation) 自然计算 相关的人体传感技术 Voice recognition 声音识别 Finger identification 手指触摸鉴定 Gaze vector Facial expression 面部表情 Handheld device movement 手持设备动作 Biometrics (body temp, heart rate, skin impedance, […] - [帝都2011](https://mdong.org/2011/11/%e5%b8%9d%e9%83%bd2011/): This content is password protected. To view it please enter your password below: Password: - [「milk香港版」交互设计漫谈(2)——社会化分享](https://mdong.org/2011/11/%e3%80%8cmilk%e9%a6%99%e6%b8%af%e7%89%88%e3%80%8d%e4%ba%a4%e4%ba%92%e8%ae%be%e8%ae%a1%e6%bc%ab%e8%b0%88%ef%bc%882%ef%bc%89-%e7%a4%be%e4%bc%9a%e5%8c%96%e5%88%86%e4%ba%ab/): This content is password protected. To view it please enter your password below: Password: - [DiDa...](https://mdong.org/2011/10/da/): This content is password protected. To view it please enter your password below: Password: - [2011留在魔都的影子](https://mdong.org/2011/10/2011%e7%95%99%e5%9c%a8%e9%ad%94%e9%83%bd%e7%9a%84%e5%bd%b1%e5%ad%90/): 地点:上海普陀 设备:EVO4G 收录至《MILK FOTO》创刊号 2012年4月出版 - [《现在发现你的优势》](https://mdong.org/2011/09/%e3%80%8a%e7%8e%b0%e5%9c%a8%e5%8f%91%e7%8e%b0%e4%bd%a0%e7%9a%84%e4%bc%98%e5%8a%bf%e3%80%8b/): 呐,上个月leader拿过来了的一本书《现在,发现你的优势》,走马观花的看了些内容,印象不多。 最近是有些许迷茫了,重新拿来,在间隙把内附称之为Strengths Finder(优势识别器)测试做了一遍,稍感收获与慰藉。 您的标志主题 The Gallup Organization 多年的研究表明,效率最高的人往往是那些非常了解自己的优势和行为的人。 这些人最擅长通过制定策略来满足日常生活、职业发展以及家庭的需求,甚至可能达到更高的水平。 回顾您所拥有的知识和技能可以让您对自己的能力有一个基本的认识,但是了解自己的天赋将会切切实实地揭示您始终成功的核心原因。 您的“标志主题”报告中包括 5 项您最出众的天赋主题,它们按照您在 StrengthsFinder 中的测试结果进行排序。 在您所测评的 34 个主题当中,这些主题排在前五位 您的标志主题对于最大限度地发挥那些有助于您成功的天赋来说至关重要。 通过关注您的各个标志主题并加以综合考虑,您可以确定自己的特长、把它们培养成自己的优势,同时在保持连续近乎完美的业绩的过程中享受个人及事业成功的喜悦。 搜 集 你充满好奇。你爱攒东西。你可能搜集信息,譬如词汇、事实、书籍和语录。 你也可能搜集有形的东西,如邮票、标本、古董、老照片等等。无论你搜集什么, 你这样做是因为你感兴趣。你好奇心不泯。世界的激动人心之处就在于其多姿多 彩,变幻无穷。如果你博览群书,你的目的未必是完善你的理论,而是积累更多 的信息。如果你喜欢旅行,那是因为在新的地点你能发现新奇的文物和轶事。这 一切均可供收藏。为什么它们值得收藏呢?你在收藏之时,常常说不清何时或为 何需要它们。但是,未来会怎样?是啊,谁能说准它们什么时候用得着呢?由于 想到各种用途,你什么都不舍不得丢弃。所以你不断搜集、整理和储存坛坛罐罐。 这很有趣。它使你思维常新。而且,也许某一天,也许就在这几天,有些东西会 变得珍贵。 专 注 “ 我走向何方?”你扪心自问。这一问题每天都萦绕脑际。在专注主题的指引 下,你需要一个明确的目的地。没有它,你很快就会对自己的生活和工作一筹莫 展。因此,每年,每月,甚至周,你都做你爱做的事制定目标。你的目标,无 论 长期或短期,都有相同的特点。它们都很具体,都能评测,并且都有进度表。这 些目如同罗盘,帮助你确定重点,并进行必要的修正,以保持航向。你的专注主题十分强大,因为它迫使你进行过滤-本能地判断某个行动是否有助于你达到目 标;无助于此的便被放弃。你的专注最终迫使你提高效率。无庸讳言,这种模式 的另一面是,它使你难以忍受拖延、障碍,甚至迂回,而无论它们多么引人。这 使你成为一名极其可贵的团队成员。当别人开始溜向“有趣的”岔道时,你会及 时把他们带回正路。你的专注主题提醒每个人,如果一件事不能帮助大家通往目 的地,那它就无关紧要。而如果它无关紧要,那就不值得为它浪费时间。你确保 每个人都目不斜视。 审慎 你为人谨慎,处世警觉。你是一个十分关注隐私的人。你深知世事难测。表面上一切井井有条,但深处危机四伏。你并不否认这些危险,相反,你把它们全部暴露在光天化日之下,逐一识别、评判,并最终消除。就此而言,你是一个十分认真的人,你对生活的态度是有所保留的。例如,你喜欢提前计划,以防不测。你谨慎地选择朋友,并避而不谈私事。你避免过度赞扬别人,以免被人误解。如果有人因为你不如别人热情洋溢而对你不满,那就随他的便。在你看来,生活不是一场取悦的竞赛,而更象一片雷场。其他人如果愿意尽可以不顾一切地跑过去,你则不然。你识别各种危险,判断其各自影响,然后小心地落脚,谨慎前行。 自信 在你的心灵最深处,你对自己的优势充满信心。你深知你是个有能力的人-有能力冒风险,有能力接受新的挑战,有能力提出要求,并且更重要的是,有能力履行诺言。然而不仅如此,由于具有自信的主题,你不仅对自己的能力,而且对自己的判断充满信心。当你观察世界的时候,你深知你的视点与众不同。而由于没有人看问题的角度与你完全一样,你知道没有人能为你作决定;也没有人能告诉你如何去思考。他们能够引导,能够建议,但只有你才是自己生活的主宰。只有你才有权作结论,下决心,去行动。这种权威,这种对自身生活方向的终极负责,并不使你畏惧。相反,它对于你顺乎自然。无论碰到什么情况,你似乎总能悟出该做什么。它也许并不适用于所有的人,但它是特定形势下你该做的事情。这一主题给你罩上一层神机妙算的光环。你与许多人不同,从不轻易被别人的论点所左右,无论他们多么巧言令色。这种自信既可能深藏不露,也可能一目了然,这取决于你的其他主题,。但它根深蒂固,牢不可破。一如舰船的龙骨,它能抵御各种压力,使你把稳航向。 理 念 你为理念而痴迷。什么是理念?理念就是概念,就是对大部分事件的最合理的解释。当你透过复杂的表层,发现一个精彩而简明的概念,继而解释事物的本质时,你会喜不自胜。理念是一种关联。你的头脑总在寻找关联;因此,当表面截然不同的现象被某个不起眼的纽带联系在一起时,你会感到新奇。一个理念是对习以为常的挑战的全新见解。你乐于将我们熟知的世界转一个圈,让我们从一个陌生但充满新意的角度看它。你喜爱所有这些理念。因为它们深刻。因为它们新颖。因为它们能正本清源。因为它们引发争论。因为它们怪诞。由于所有这些原因,每当你产生一个新理念时,你都为之一振。别人可能视你为锐意创新、标新立异、富于理性或聪明过人。也许这些你都是。谁能说得准呢?你确信无疑的是理念使你激动不已。而大多数日子里,这就足够了。 - [「milk香港版」交互设计漫谈(1)——Splash screen](https://mdong.org/2011/08/%e3%80%8cmilk%e9%a6%99%e6%b8%af%e7%89%88%e3%80%8d%e4%ba%a4%e4%ba%92%e8%ae%be%e8%ae%a1%e6%bc%ab%e8%b0%88%ef%bc%881%ef%bc%89-splash-screen/): 当产品相对稳定与可控,小神有愿望快速记录这个项目。 内容涉及小神参与产品设计与执行的过程,由交互/视觉设计层面的需求分析、功能设计与设计执行组成。 与其带入一些工作中的设计技巧,小神更愿意分享其中的设计思想与理念憧憬。 设计之所以不同于美化,是因为前者被赋予了驱动的灵魂。 背景 milk香港版,内部命名”milk mobile”。是香港潮流杂志《milk》在移动新领域的合作尝试。目标设备为主流的中高端便携移动设备,iPhone/iPod touch/Android Phone/WP7…目前iOS版本如期发布,您可以从这里获得最新的版本。其它平台蓄势待发… 在发布后两周中,milk香港版荣得Apple app store的”新品推荐”与”热门推荐”,Lifestyle排位第二。 小神在过去的三个月,从零开始着手milk香港版的设计执行。 设计的生命周期 在展开一项工作时,我们都希望对它在整体上有所控制。 一个相对清晰的timeline使得设计在时间与质量之间平衡,并在恰当的里程碑有所产出,跟随整个项目进展。 milk mobile的设计定义 milk mobile的品牌与内容定位,决定这即是一面向城市快速消费的精神食粮。 它具备几个特质——高时效性、眼球经济、缺乏耐心的。 继而在视觉与操作着力营造如此的氛围: 信息传递的高度流畅。 信息呈现的节奏感。 轻松的操作浏览环境。 探索从Splash screen开始 Splash是用户进入App,直到程序完全可用前,显示的第一个视图。 Splash Screen概念存在的价值 品牌识别(权重30%) 当用户通过桌面icon进入milk香港版,会再此传达具有品牌象征的手写milk英文字符。与milk其它产品形象统一,用户得以加深认同感与归属感。 必要的数据加载与反馈过程(权重70%) 对于milk香港版而言,splash screen的存在更多承载的是功能层面的需求。 对网络与cache的不同状态产生的scenarios进行处理,并提供良好的反馈。 在iOS Human Interface Guidelines,对Splash的概念有较为详细的阐述,你可以点击这里查看。但并不赞同对Splash Screen的一个定义——Launch Images。 我们所感知到的信息是流动的,图像与其承载的信息也应该在表现上流动,贴近感知。 流动的图像表现上更贴近于animation,iOS从文字示意上误导设计人员并限制了它的可能性。 Launch/Splash是一个无限延展的屏幕空间,不仅是”图像”。 作为跨平台设计,Android对Splash screen的理解,更注重实用性。 If your application has a time-consuming initial setup phase, consider showing a splash screen or rendering the main view as quickly as possible and filling in the information asynchronously. In either case, you should indicate somehow that progress is being made, lest the user perceive that the application is frozen. Windows Phone 7注重信息传递的效率。绝对效率是应该被真正推崇的,当你不能提供更好的理由使其存在。 […] - [突围与革变](https://mdong.org/2011/07/%e7%aa%81%e5%9b%b4%e4%b8%8e%e9%9d%a9%e5%8f%98/): 厌倦每天重复为设备充电。 厌倦随时携带几台需求交叠的设备。 厌倦花样功能毫无持久力的软体应用。 厌倦毫无关联干瘪应用为中心的生活。 我开始放弃EVO4G,它笨重并且无尽的消耗电力。 保持Mozart,保持基本通信、工作同步与信息查询。 我有4000毫安的移动电源,它支持Mozart续航。 远离iPod itouch,它切割了时间。 保持Kindle,轻巧并联系着真实的阅读。 移动,快速高效至上,并产出浮躁。 琳琅满目,无从选择与尝试。 其实“生活”,并不需要这么多。 硬件需要平衡,性能、便携与续航力。 软体需要平衡,专注、效率与会心一笑的别致。 联系回归真实的“生活”。 - [milk香港版](https://mdong.org/2011/07/milk%e9%a6%99%e6%b8%af%e7%89%88/): 由2001年7月開始,《MILK》雜誌一直代表潮流指標。《MILK》誌集設計與時尚於一身,希望給年輕讀者團員最好的選擇。我們盡力為讀者帶來刺激思維的新概念及資訊,希望打破香港以娛樂為主的雜誌風氣。我們的編輯部每星期均竭盡所能搜羅全世界不同領域,不同範疇的最新資訊,同時,文化及設計等也是我們關心的;所以在《MILK》誌內,每位讀者都可以得到各方面均勻與正面資訊。我們明白讀者團員都愛嘗試新事物,2010年,《MILK》誌矢志走向多媒體,除了開設FACEBOOK及新浪微博作為與讀者溝通的橋樑外,更破天荒推出“MILK香港版 HD”、“MILK香港版”,透過不同的社交網絡,滿足大家的需要,希望各位可以從中接收更多嶄新的新意念,從而尋找及建立個人風格。 您可以访问这里milk香港版了解更多,覆盖iPad、iPhone以及Android。 7月18日凌时起,可通过在itunes搜索“milk香港版”,获得下载。 如果您对 milk香港版 有任何的问题,请在这里回复留言。或者邮件至info@i-milk.com。 - [质疑团队责任](https://mdong.org/2011/06/%e8%b4%a8%e7%96%91%e5%9b%a2%e9%98%9f%e8%b4%a3%e4%bb%bb/): 原文:Questioning Team Accountability Glen Alleman介绍了他们使用的业务管理流程——称为Afterburner——及其它对个人成功责任的依赖。Glen接着描述了他对团队责任而非个人承担责任的想法感到不适。根据本月Afterburner的视频通讯,在四步过程:1)计划,2)简介,3)执行,4)汇报中,如果我们无法回答“谁对失败负责?”这个问题,汇报无法做到有效。 Glen质疑了团队责任,这意味着没有个体对成功和失败负责。Andrew Joiner给出了一个回应: Scrum或敏捷都没说个体不负责任。他们当然负责任;在一个sprint中,每次他们做一个任务时他们都是向团队做出承诺,并且有责任完成这个任务,无论是否需要帮助。 此外,作为团队整体也对在sprint计划会上承诺的可交付物负责。如果情况有变,那么这种责任要求通过重要的对话来重新估算并确认或改变早先的承诺。 “集体所有权”是一个经常用在代码库上的术语,最早来自于XP。它意味着没有一个人“拥有”代码的任何一部分。任何有足够技巧的人都可以负责任的修改代码。它和XP的其它实践相互支撑,比如持续集成、结对编程等等。 但Glen的观点也是有根据的,因为“集体责任”难以理解和实施: 只能有一个人负有最终责任(accountability)。其他人也可以负责(responsible)。许多最终责任与管理的核心原则相矛盾。负最终责任的人可以分解责任。这些原则不仅来自项目管理,也来自GAAP、SOX和业务治理。 当然代码的集体责任与领域及上下文背景高度相关。 这是理解自组织团队特别是实施敏捷开发的团队中比较困难的部分。我们在2009年敏捷大会对Christopher Avery的采访中,深入的讨论过这个话题。我们问了Avery关于个人责任和自组织团队的关系是怎样的: 我试图教给聪明的人如何建设团队,我记得在采访的开始,(我问)什么是精髓?精髓就是要求团队成员分担责任,当人们觉得一些大事能够为大家所分担,那么他们的行为就自动的转变,是有机的转变。我有一些技巧教给人们如何做到。 ……如果我们专注于我们在一条船上并且能获得更大的成功,那么就意味 着这是我们每个人的意愿,如果我们有主人翁意识意味着我们会有机的填补上空白、补上缺陷、改进流程。他们说团队中的角色都是新的,究其原因是因为团队总是 临时的而且是由更大的任务决定的,当人们有一种能要把事情搞定的感觉时,他们就会投身其中做需要完成的事情。 Avery教给我们的是因为没有个人的失败,也没有个人的成功,所以个人的责任是不够的。因此虽然仍然有个人责任,一个人的失败也是团队的失败(“不是我的翅膀着火”原则)。团队需要对项目的成功集体负责而不是追究是谁的错误。 组织责任是不是与你产生共鸣?是不是我们模糊了“最终责任(accountability)”,“职责(responsibility)”和“所有权”的使用方法?而且,最重要的是,它会如何影响你的结果? - [被绑架的数字生活](https://mdong.org/2011/06/%e8%a2%ab%e7%bb%91%e6%9e%b6%e7%9a%84%e6%95%b0%e5%ad%97%e7%94%9f%e6%b4%bb/): This content is password protected. To view it please enter your password below: Password: - [积米 你随身的逛街宝典](https://mdong.org/2011/04/%e7%a7%af%e7%b1%b3-%e4%bd%a0%e9%9a%8f%e8%ba%ab%e7%9a%84%e9%80%9b%e8%a1%97%e5%ae%9d%e5%85%b8/): 积米是你可以随身携带的购物休闲宝典。无论是购物中心的特卖会,或是你钟爱品牌的优惠活动,还是附近特色小店的最新资讯,你都可以在积米应用中一目了然。让我们一起参与积米,寻找优惠,积累财富,做积米的fans,做精明的“米饭”,现在就来体验吧! 请访问这里http://www.jimi.com 下载适合你的版本吧 android iPhone俱有喔~ - [It’s Time To Do Your Own Thing](https://mdong.org/2011/04/its-time-to-do-your-own-thing/): its-time-to-do-your-own-thing Why do you read TCH? Does it inspire you to create, start a business, design a product, improve an idea? Does it make you want to innovate or imitate? Does it inspire you travel, or live in another city or country? Do you need someone else to tell you your product/idea/execution/brand is great? We say don’t worry what anyone else thinks, trust your own judgment. When others doubt, be confident in your vision. Stop waiting for the perfect time to do what you want to do. Just go for it and do it now. Don’t’ follow fashion trends. The […] - [移动界面设计点滴(5)——主功能入口设计 tabbar or grid-based](https://mdong.org/2011/03/%e7%a7%bb%e5%8a%a8%e7%95%8c%e9%9d%a2%e8%ae%be%e8%ae%a1%e7%82%b9%e6%bb%b45-%e4%b8%bb%e5%8a%9f%e8%83%bd%e5%85%a5%e5%8f%a3%e8%ae%be%e8%ae%a1-tabbar-or-grid-based/): This content is password protected. To view it please enter your password below: Password: - [MDchina.org上线](https://mdong.org/2010/11/mdchina-org%e4%b8%8a%e7%ba%bf/): This content is password protected. To view it please enter your password below: Password: - [(译)手持设备的可用性研究](https://mdong.org/2010/11/%e8%af%91%e6%89%8b%e6%8c%81%e8%ae%be%e5%a4%87%e7%9a%84%e5%8f%af%e7%94%a8%e6%80%a7%e7%a0%94%e7%a9%b6/): 原文 usability for handheld devices versus computers 译文 手持设备的可用性研究 当前有许多用户在不同的特定环境中使用不同的移动设备——包括智能手机、数码相机、MP3播放器、电子书与GPS(全球定位系统)。当用户离开桌面电脑之后,这些用户界面在设备上该如何表现?如何对设备进行设计——包括由硬件驱动的控制、交互模型与功能键布局——这将决定设计与软件应用的可用性。我们如何理解用户在移动中的体验。接下来会回答这些问题,以及更多关于手持移动设备的移动用户体验、交互设计与可用性的问题。 设计中唯一重要的事情是设计本身如何与人相关联。——Victor Papanek 企业逐渐地在电子消费产品中引入更多的高级技术,手持设备每天占用了人们越来越多的时间。用户与手持设备的交互与以桌面电脑为平台的网站有着同样的交互麽?什么类型的挑战是用户日复一日地在使用范围如此之广的手持设备所面对的?什么是可用性专业人员在研究不同平台可用性所考虑的? 单手还是双手? 第一个非常大的问题是,用户需要单手还是双手来操作设备?通常与桌面电脑的网站交互时,在操作一个标准键盘时使用双手,使用鼠标或其它点击设备需要单手。有些时候这个决定是在情景下驱使的。比如,用户在驾驶交通工具操作GPS设备时只有一只空余的手。有些决定是从文化角度驱使的。比如,在日本的智能手机用户习惯于单手操作,因为他们经常在奔驰的列车上用另一只手抓住栏杆。 无论我们打算用单手还是双手使用设备,都会很大程度上影响到我们如何设计它——因此,影响到用户如何理解它的可用性。可用性专业人员需要在计划测试任务与创建测试情景时,将该因素加入考虑。 一个标准的键盘还是不同按键的集合? 当用户与桌面电脑的网站进行交互时,一个标准的QWERTY键盘提供了一个近似的始终如一的交互模型。然而,当与手持设备进行的交互,用户可能需要操作特定的设备或者通过硬控件,如按钮,或直接触摸屏操作控件。手持设备有许多不同的形状,有很多不同类型的控件。比如,Sony阅读器与Amazon Kindle有非常不同的按钮集合。Sony阅读器的特点是有10个数字按钮、一个五维按键集合。Kindle有一个QWERTY键盘、前一页与后一页按钮、一个五维按键集合与一个后退按钮。两个企业设计它们的设备为用户提供更好的阅读体验,它们的设计师在考虑如何使用户与数码阅读设备交互,当然基于不同的想法。五维按键集合可以使它们更容易的上下左右操作。一个QWERTY键盘使得输入更容易。 当与不同类型的手持设备交互时,有时缺乏标准化的体验会增加用户的挫败感。因为缺乏标准化,可用性的专业人员必须为移动设备的可用性做系统化地思考,而不只是专注在一个孤立的按钮。因此问及如用户理解如何使用这个特定的按钮,等类似的问题时,需要有更有意义、更有益的提问——一个特定设备的全部按钮集合如何帮助用户完成任务,用户可以成功地找到操作设备的方式麽?他们在按钮集合中迷路了麽? 什么是设备的应用场景? 用户不会在真空中使用手持设备(宇航员除外^^)。他们在驾驶汽车并使用GPS;或者在列车上与朋友发送短信;或者他们在旅途中使用相机捕捉风景;或者他们在公共汽车上并使用Kindle阅读图书。所有的事情发生在围绕联系用户而创建的设备使用的应用场景——这是设备的用户体验的重要组成部分。用户使用手持设备的情景、环境在评估其设备的可用性时基于非常不同的考虑因素与事件。 例如当用户与数码相机进行的交互,他们经常尝试捕捉好的镜头——可能是一个飞逝的瞬间——有非常短的时间与需要操作相机的注意力。设计师如何优化相机的设计——确保用户可以轻松无误的按下正确的按钮——是相机可用性非常重要的一方面。当用户操作一个GPS时,驾驶通常是一个最高优先级的任务。用户只有有限的注意力可以操作GPS,在驾驶场景中,用户界面的按钮要足够大,以方便使用。这同样是为什么语音命令目前在导航系统用户界面中扮演了一部分的角色。 研究手持设备可用性的方法 上述考虑到的想法是非常清晰地,但在实验室中的可用性测试对于研究手持设备可用性并不理想。当有一个特定的实验室测试环境需要参与者参与,他们会从进入实验室开始即进入一个测试模型。他们开始会思考实验设备,将要在其中发生什么,在测试中什么样的事情他们可能会经历。我听过当进入一个可用性实验室的参与者有像这样的评论“这个是新的…”或者”我在此之前从没做过…”。一旦人们走出实验室,他们会回到原来的自己——开始使用他们自己的手持设备,但与刚刚他们告诉我们他们经常操作的方式完全不同。 虽然参与者在可用性测试中有完全的自由,用户研究者已经创建了一个非常好的测试情景,在实验室的测试还是不能提供丰富的真实生活可以提供的环境。真实生活的文化与环境元素是不存在的。在实验室环境中,不可能重现所有的真实生活的小事件,这些小事件会影响到人们在真实环境中使用手持设备的方式。 理想中,如果一个用户研究者作为一个无形的影子会更好,跟随在参与者的周围而不是强加到他们的现实中。例如,当参与者在驾驶中努力尝试使用一个新的GPS系统,研究者可以坐在他的旁边,观察他的体验中发生的所有问题。有许多的方法可以使得用户研究者、可用性专业人员与参与者走的更近。 对家中或工作的拜访是经常优于在实验室的可用性测试。当研究者与参与者到非常熟悉的地方,参与者在演示典型的日常设备使用会更舒适。参与者与研究者的会话,发生在参与者的日常环境会经常帮助想到使用设备的特定的故事,这经证明是非常有价值的并提供了很好的洞察机会。 短期、纵向研究对于手持设备的可用性研究也非常有益。更长的观察周期是使得参与者能够在一个更松懈的自然的方式体验设备,允许出现更多随机的故障与问题。如果参与者有足够目的明确的保持接触,通过纵向研究在每一天的过程中发生了什么,日记也可以很有成效。然而,回顾日记可能并不是对于所有的参与者都可行。许多人发现在每天晚上保持久坐,并思考一天究竟发生了什么是一件困难的事情。在真实的设备中的日志可能是一个好的替代选择。它会提示参与者去做简单的记录而无须考虑是否需要。 总结 用户从手持设备中,面对着与桌面电脑的网站交互的非常不同的可用性挑战。作为可用性专业人员,我们需要考虑一个设备从单手或双手的使用。同样的我们观察用户与手持设备的交互,这将有益于系统地思考设备的可用性,而不只是局限于独立按钮的使用。 当前情景在手持设备的使用中扮演一个非常重要的角色。家庭或工作拜访、短期、纵向研究、日记比起实验室的传统可用性测试会更合适。 - [移动界面设计点滴(4)——为了阳光而设计](https://mdong.org/2010/10/%e7%a7%bb%e5%8a%a8%e7%95%8c%e9%9d%a2%e8%ae%be%e8%ae%a1%e7%82%b9%e6%bb%b45-%e4%b8%ba%e4%ba%86%e9%98%b3%e5%85%89%e8%80%8c%e8%ae%be%e8%ae%a1/): This content is password protected. To view it please enter your password below: Password: - [Desktop端UI测试概要](https://mdong.org/2010/09/desktop%e7%ab%afui%e6%b5%8b%e8%af%95%e5%bf%ab%e9%80%9f%e6%95%99%e7%a8%8b/): 最近在做一些测试,为产品的顺利公测做部分支持。 以下为Desktop端的测试。 第一部分: Windows程序UI设计初步 1.背景介绍 UI就是用户界面( user interface ) ,就是人和工具之间的界面。在人和机器的互动过程中,必须经由界面。这个界面实际上是体现在我们生活中的每一个环节的,例如我们开车时候方向盘和仪表盘就是这个界面,看电视的时候遥控器和屏幕就是这个界面,用电脑的时候键盘和显示器就是这个界面,到了使用软件的时候,用户能够通过视觉看到的都是界面。这个界面包括硬件和软件。我们这里讲的UI设计特指Windows操作系统下的软件界面。 用户界面设计有三个基本的原则:a. 置界面于用户的控制之下;b. 减少用户的负担;c. 保持界面的一致性。 从程序设计开发的角度来看,界面设计可以分为结构设计、交互设计、视觉设计三个部分。 结构设计也称概念设计 (Conceptual Design),是界面设计的骨架,通过对用户研究和任务分析,制定出产品的整体架构。基于纸质的的低保真原型(Paper Prototype)可提供用户测试并进行完善。在结构设计中,目录体系的逻辑分类和语词定义是用户易于理解和操作的重要前提。 交互设计是程序的神经,使用户与软件处理部分进行沟通,最终目的是使产品让用户能简单使用。 任何产品功能的实现都是通过人和机器的交互来完成的。因此,人的因素应作为设计的核心被体现出来。   1)有清楚的错误提示。错误操作后,系统提供有针对性的提示。   2)让用户控制界面。“下一步”、“完成”,面对不同层次提供多种选择,给不同层次的用户提供多种可能性。   3)允许兼用鼠标和键盘。同一种功能,同时可以用鼠标和键盘。提供多种可能性。   4)允许工作中断。例如用手机写新短信的时候,收到短信或电话,完成后回来仍能够找到刚才正写的新短信。   5)使用用户的语言,而非技术的语言。   6)提供快速反馈。给用户心理上的暗示,避免用户焦急。   7)方便退出,如手机的退出,是按一个键完全退出,还是一层一层的退出。提供两种可能性。   8)导航功能。随时转移功能,很容易从一个功能跳到另外一个功能。 视觉设计是在结构设计的基础上,参照目标群体的心理模型和任务达成的,是程序的脸面,要达到使用户愉悦的目的,包括色彩、字体、页面等。视觉设计的原则如下:   1)界面清晰明了。允许用户定制界面。   2)减少短期记忆的负担。让计算机帮助记忆,例:User Name,、Password、IE进入界面地址可以让机器记住。   3) 依赖认知而非记忆。如打印图标的记忆、下拉菜单列表中的选择。   4)提供视觉线索。图形符号的视觉的刺激;GUI(图形界面设计):Where, What, Next Step。   5)提供默认(default)、撤销(undo)、恢复(redo)的功能   6)提供界面的快捷方式。   7)尽量使用真实世界的比喻。如:电话、打印机的图标设计,尊重用户以往的使用经验。   8)完善视觉的清晰度。条理清晰;图片、文字的布局和隐喻不要让用户去猜。   9)界面的协调一致。如手机界面按钮排放,左键肯定;右键否定;或按内容摆放。   10)同样功能用同样的图形。   11)色彩与内容。整体软件不超过5个色系,尽量少用红色、绿色。近似的颜色表示近似的意思。 2. UI设计的一些原则。 对于Windows用户来说,用户认识到的就是所看到的。必须看到的现实就是:界面是面向用户的,用户需要的是开发者开发的应用软件满足其需求,并且易于使用。好的用户界面使得用户不用阅读用户手册或接受培训就能使用应用软件。 2.1 交互设计的一些原则: 2.1.1有清楚的,针对性的操作提示。 使用讯息和标签措辞要适当。屏幕上显示的文本是用户主要的信息源。文本措辞直接影响用户的理解。要使用用户的语言,而非技术的语言。讯息措辞要积极,显示用户处于控制之中,并提示如何正确使用软件。如, “你输入了错误信息”还是“帐号应为8位数”会给用户不同的体验。此外,讯息措辞要一致,在屏幕上显示的位置要一致。 2.1.2让用户控制界面。”下一步”、”完成”,面对不同层次提供多种选择,给不同层次的用户提供多种可能性。让用户知道自己当前的位置,使其做出下一步行动的决定。允许工作中断,方便退出。整个交互过程提供快速反馈。给用户心理上的暗示,避免用户焦急。 2.1.3允许兼用鼠标和键盘等多种输入。同一种功能,提供多种方式。 2.1.4使用非破坏性的缺省按钮。通常每个屏幕定义一个缺省按钮,如果用户按了回车键调用此按钮。问题是有时用户会意外敲击回车键,结果激活了缺省按钮。缺省按钮决不能有潜在的破坏性,如删除或保存(也许用户根本不想保存)。最好的方法是使用组合键来设置按钮,更彻底的方法是去掉默认按钮,这违背了同时支持多种输入的原则,但是在特定的场合是可以考虑的。 2.1.5在操作焦点处打开窗口。当用户双击一个对象显示其编辑/详情屏幕,用户的注意力亦集中于此。因而在此处而不是其它地方打开窗口才有意义。 2.1.6弹出菜单不应是唯一的功能来源,主要功能菜单不应该被隐藏起来。适当使用上下文相关菜单。根据情况提供鼠标右键的这种菜单,缺少过滥都是不科学的。 2.1.7提供标准的常用功能 ,提供界面的快捷方式。如,常用的按钮、菜单应该有和其它同类软件相同的快捷键,一般 打开放在文件菜单下。如果一个菜单项,按下去会弹出一个窗口,那么这个菜单项的文字末尾应该有一个省略号来暗示用户,例如 “打开…” 2.1.8要考虑各种层次的用户的操作水平的不均衡。 2.2视觉设计的一些原则: 2.2.1一致性。保证界面的协调一致。对于列表框来说,如果双击其中的项,使得某些事件发生,那么双击任何其它列表框中的项,都应该有同样的事件发生。所有窗口按钮的位置要一致,标签和讯息的措辞要一致,颜色方案要一致。 2.2.2 界面布局很重要。人们是自左而右,从上而下阅读,基于人们的习惯,屏幕的组织也应当是自左而右,从上而下。界面清晰明了,屏幕不能拥挤,拥挤的屏幕让人难以使用。实验结果(Mayhew,1992年)显示屏幕总体盖度不应超过40%,而分组中屏幕盖度不应超过62%。如果要表达的信息比较多,最好分屏显示。 区域排列。当屏幕有多个编辑区域,要以视觉效果和效率来组织这些区域。区域左对齐是最好的方法。与之相应的标签则应右对齐,置于编辑区域旁。这是屏幕上组织区域的一个整洁有效的方式。 数据对齐要适当。对一列列的数据,通常的作法是整浮点数右对齐,字符串左对齐。 有效组合。逻辑上关联的项目在屏幕上应当加以组合,以显示其关联性。反之,任何相互之间毫不相关的项目应当分隔开。在项目集合间用间隔对其进行分组/或用方框也同样可做到这一点。 2.2.3界面间切换很重要。如果从一个屏幕转换到另一屏幕很困难,用户会很快灰心并放弃。当屏幕流程与用户想完成的工作流程相符,此软件对用户才有意义。由于不同用户工作方式不同,应用软件需要有足够的灵活以支持他们不同的方式。尽可能的提供给用户一个相对容易、自由的操作界面; 2.2.4 提供视觉线索。图形符号的视觉的刺激远远大于文字。尽量使用真实世界的比喻。如:电话、打印机的图标设计,同样功能用同样的图形。加图标的目的是为了使它更醒目,更突出。但是如果不加区分的全加、滥加,反而突出不了重点,都是重点就等于都不是重点。加图标要保持风格一致,不要一个按钮的图标是XP风格的真彩图标,下一个又成了Win95风格的16色图标,到下一个又成了Mac风格的唯美图标,这样一个大杂烩显得极不专业,降低用户的信赖度。 2.2.5色彩与内容。整体软件不超过5个色系,尽量少用红色、绿色。近似的颜色表示近似的意思。颜色使用要适当,得一致,以使整个软件有同样的观感。此外,在不同平台上,色彩的表现不尽人意.在一个系统上看上去很好,在另一个系统上常常看上去很糟,需要考虑软件的运行环境而不是开发环境下闭门造车。颜色的使用要遵循对比原则。确保屏幕的可读性,最好的方法是遵循对比原则:在浅色背景上使用深色文字,在深色背景上使用浅色文字。蓝色文字以白色为背景很容易读,但以红色为背景很难辨认。问题出在蓝色与红色之间没有足够反差,而蓝色与白色之间则反差很大。字体使用要适当。要用那些可读性好的字体,如Times Roman。节俭、有效地使用两、三种字体的屏幕看上去远胜于使用五、六种字体的屏幕。此外,字体的使用要一致,要记住每次改变了字体的大小、风格(粗体、斜体、下划线,……)、样式或颜色,都是在使用不同的字体,就表示了他们的不完全一致。显示一定要考虑用户所使用的输入/输出设备,如触摸设备相对要大些。 2.2.6豪华界面,不适合所有的软件。华而不实的感觉往往来自界面。一般来讲,游戏类、播放器类,需要美丽的界面。 3. 用户的操作 对于用户来说,操作越简单越好,程序的使用思路越清晰越好。下面结合环境简单说明一下常用控件该如何合理使用。 3.1对于较长时间的运算: 建议使用进度条(progress bar)比如要进行数据库操作,需要时间长的情况。使用进度条可以让用户有个等待的时间,否则用户不知道你的程序在干什么,用户对于不明不白花费的时间一般容易恼火。设计的时候,对自己的操作运算时间进行估算,确定是否需要使用。如果只有5秒钟,用户一般是可以忍受的,加入进度条反而会产生画蛇添足的效果。 在使用进度条的同时,可以配合使用状态栏。StatusBar经常被放置在窗体的下面,建议使用dock。可以在状态栏中提供多个面板(pane)来提供不同的信息。 状态栏中,通常都会有一个面板来提示程序运行的信息,例如显示进度,时间等。需要扩展的话,需要owerndrawn属性支持。可以添加按钮等,如取消。一般,在长时间的后台运算开始时,在状态栏中设置开始的状态信息,在计算结束之后,清除状态信息或将状态信息设置为停止状态,在后台运行期间通过状态栏来显示必要的错误信息,提示用户当前的状态。比如,进行一个计算时,开始显示:正在计算,请耐心等待。当运算结束时显示:可以结束,正确退出。 等待指针的使用,在进行计算的时候,尤其在很难计算出这些操作的进度的情况下,设置前台鼠标指针为wait cursor是对用户一个很好的提示。如果有些操作必须是阻塞的,这时需要使用等待指针(wait cursor)也是对用户很好的交代。同样,光标的形状是非常灵活的,合理的使用能够给用户恰当的提示。 总之,使用上面的控件,能通过可视化的方式通知用户有一些程序正在执行过程中,可能需要等待一定的时间。 在程序中合理使用try…finally语句可以达到很好的效果。保证无论遇到什么情况,是正常也还,是异常也好,反正最后都会执行到finally。 3.2操作开始之后,在适当的时候提供必要的程序开关。 用户应当能够通过界面操作取消或终止较长时间的运算。不管你在做什么,都要给用户一个机会,因为用户是程序的使用着。当然,不能让用户,任何时间都可以插手程序的操作,比方,一个数据保存的界面,保存,关闭,取消三个按钮,当正在保存数据的时候,如果强行关闭的话,会导致数据的异常,在这种情况下就需要适当的启用,禁用控件。对于该界面来说,“保存”点击后,禁用“关闭按钮”。在保存处理完毕后,再启用“保存按钮”。 3.3适时合理禁用一些菜单 通过可视化的方式提示用户在运行某些程序的时候某些功能是被禁用的,程序结束后,重新启用一些被禁止的菜单和控件,并通过适当的方式提示用户操作已完成。同时,适当的启用禁用菜单可以使用户更清晰的理解应用程序的工作流程,理解应用程序执行的逻辑。比如用户,一般先要看你界面上什么功能可以使用,什么需要达到一定的前提才能使用。在执行某功能的时候,通过禁用启用,可以知道这个不能执行。当执行完毕后,用户发现,哦,那个按钮亮了,可以执行了。 3.4验证用户的输入,使用validation control。 避免因为用户的失误,导致程序的失败,意外。使用界面友好的MessageBox,注意要在提示对话框中使用适当的按钮和图标,它的重载比较多,根据具体的情况选择不同的图标和按钮。比方说,如果用户强行退出,可以弹出警告,这个时候就应该告诫用户可能产生的不良后果。 3.6使用适当的控件 使用TreeView控件来显示有层次的数据,使用ListView来显示一组具有多个列的数据,使用DataGrid控件可以让用户改变每一个单元格中的数据,使用TabControl可以将窗体中的控件按照使用逻辑进行分类,根据具体的需要开发复合控件,扩展控件,自定义控件。 3.7 […] - [移动界面设计点滴(3)——工欲善其事,必先利其器](https://mdong.org/2010/08/%e7%a7%bb%e5%8a%a8%e7%95%8c%e9%9d%a2%e8%ae%be%e8%ae%a1%e7%82%b9%e6%bb%b43-%e5%b7%a5%e6%ac%b2%e5%96%84%e5%85%b6%e4%ba%8b%e5%bf%85%e5%85%88%e5%88%a9%e5%85%b6%e5%99%a8/): This content is password protected. To view it please enter your password below: Password: - [有一年,我十七岁.](https://mdong.org/2010/07/%e6%9c%89%e4%b8%80%e5%b9%b4%e6%88%91%e5%8d%81%e4%b8%83%e5%b2%81/): This content is password protected. To view it please enter your password below: Password: - [What a wonderful day](https://mdong.org/2010/07/what-a-wonderful-day/): This content is password protected. To view it please enter your password below: Password: - [别了 版画](https://mdong.org/2010/07/%e5%88%ab%e4%ba%86-%e7%89%88%e7%94%bb/): This content is password protected. To view it please enter your password below: Password: - [天气图标一组](https://mdong.org/2010/07/%e5%a4%a9%e6%b0%94%e5%9b%be%e6%a0%87%e4%b8%80%e7%bb%84/): This content is password protected. To view it please enter your password below: Password: - [移动界面设计点滴(2)——Flow大局观](https://mdong.org/2010/05/%e7%a7%bb%e5%8a%a8%e7%95%8c%e9%9d%a2%e8%ae%be%e8%ae%a1%e7%82%b9%e6%bb%b42-flow%e5%a4%a7%e5%b1%80%e8%a7%82/): This content is password protected. To view it please enter your password below: Password: - [MobileView007 Logo Design](https://mdong.org/2010/04/mobileview007-logo-design/): This content is password protected. To view it please enter your password below: Password: - [[Job]Silverlight Web Developer](https://mdong.org/2010/04/jobsilverlight-web-developer/): This content is password protected. To view it please enter your password below: Password: - [三月, 纷飞前的宁静](https://mdong.org/2010/04/%e4%b8%89%e6%9c%88-%e7%ba%b7%e9%a3%9e%e5%89%8d%e7%9a%84%e5%ae%81%e9%9d%99/): This content is password protected. To view it please enter your password below: Password: - [登录界面设计](https://mdong.org/2010/04/%e7%99%bb%e5%bd%95%e7%95%8c%e9%9d%a2%e8%ae%be%e8%ae%a1/): This content is password protected. To view it please enter your password below: Password: - [移动界面设计点滴(1)——减少空间占用](https://mdong.org/2010/03/mobile-ui-design-tips-how-to-reduce-needless-space/): This content is password protected. To view it please enter your password below: Password: - [设计中的生理色差 (2)](https://mdong.org/2010/02/%e8%ae%be%e8%ae%a1%e4%b8%ad%e7%9a%84%e7%94%9f%e7%90%86%e8%89%b2%e5%b7%ae-2/): 接上篇设计中的生理色差 (1)。 文章发出去后,很快收到了QUESTER的回复。 这个是科学的,但是并不等于是可行的解决方案。 通常来讲,没有经过训练的常人裸眼,不可能分辨出10%以下的色彩差异。 因此,在普通设计上追求校正眼球色偏差,不如多去考虑一下正常的途径:校正不同的屏幕显示颜色。 这才是比较靠谱的做法,也是实际运用中常常出问题的部分: 例如,绿色和紫色以及大部分的中间灰色,在每一台显示器上都会呈现出不太一样的状态,因此,才会有“安全色”的概念出现。 所以,你显示器上出现的灰色,有可能在你老板的显示器上是粉红色或者粉蓝色,都是说不准的事情。 因此,确认大家都在同一调校过的显示环境下工作,是视觉设计师应该熟悉的工作。 这里,Quester提供了更为广阔的思路。 统一显示效果。 设计使用安全色。 长话短说,人为参与的软硬件色彩校正,其实是平添了一个不稳定因素。 把大量的时间用来做兼容与测试是低效的,同时也会影响设计本身的质量。 统一显示设备才是正道。 —–Color-Blind——- 之前有计划写设计中的色盲原理与色彩关系,在搜索相关材料时,发现已经有几篇不错的文章了。 Web Accessibility之为色盲设计(一):他们是谁? Web Accessibility之为色盲设计(二):检验设计的工具 How to Design Web Accessible Pages for the ColorBlind 这几篇文章是站在非色盲设计师的角度进行的色盲色彩设计。 对于概念的分析已经到位。 后面追记一些之前了解到有关色盲设计师对于设计的心得。 色盲色弱设计师是可以辨识灰阶的,但这对于设计是远远不够的。影响的原因有很多,不只是大家以为的颜色,还有光线、环境色、饱和度等等,加上色盲色弱的程度有分很多种,所以很难确定工具对于改善设计的程度。 虽然有Adobe Kuler、色盘工具、Color Code、PS纵使有很多工具可以帮助解读颜色,但所显示出来的东西,毕竟是数字,顶多了解到蓝色比较多、红色或绿色比较多之类的信息,RGB任何一个值多了多少少了多少,都会造成颜色上的差异,有时候往往差一点,就让整个配色变调了。就算经验再丰富,知道怎么运用色盘上的色码,但还是有另一个问题。 平常人不会用这些色码沟通,他们可能说”Medium Orchid”、”Steek blue”之类的,这边却也不会跟他解释说这是#AACC22,是的,知道这个颜色偏红、偏蓝,但有时候却无法说出这是什么确切的颜色。 有的时候秀出设计稿,客户或上面会跟说这个什么颜色改一下。其实设计者认为没有用这个颜色,然而事实上,真的用到了那个颜色,只是没有分辨出。这个时候这样的工具就是救星了。这些工具除了提示正确的色码,甚至可以是颜色的名字,这个时候就容易除掉颜色上的错误。 有了这个小工具再配合上其他工具,相信可以使色弱色盲设计师会有大大帮助。 WhatColor 虽然色盲色弱设计师的设计有时候会很痛苦(在我看来),但其实还是有自己主观的色彩感知,那是正常人所感受不到的。有的色盲设计者所设计出来的作品有其独特的色彩风格。 Filipinas - [Silverlight安装体验优化(1)](https://mdong.org/2010/02/silverlight%e5%ae%89%e8%a3%85%e4%bd%93%e9%aa%8c%e4%bc%98%e5%8c%961/): This content is password protected. To view it please enter your password below: Password: - [设计中的生理色差 (1)](https://mdong.org/2010/01/%e8%ae%be%e8%ae%a1%e4%b8%ad%e7%9a%84%e7%94%9f%e7%90%86%e8%89%b2%e5%b7%ae-1/): 整理这样一篇文章,不求甚解,主要是希望进一步理解最近项目中出现的问题。 公司的上层有美国人,对一些模板设计提出的质疑总感觉让人摸不着头脑。 刚开始只是认为是设计中出现的问题,修改后效果并不理想。 忽然想到会不会是眼睛颜色的不同造成的色差。 我想灰度的感知应该是一样的(后来证明是错的 🙄 ),而后会在某些特定情境下会因为眼球颜色而造成认知色差。 先精确生理概念。 眼睛的颜色是一种由超过一个基因所遗传的特征,对人类来说,目前已知3个基因座(Locus)上的基因与眼睛的色彩有关,分别是EYCL1、EYCL2与EYCL3。这些基因与人类眼睛颜色的表形有关(棕色、绿色与蓝色)。虽然过去曾经认为棕色眼睛为显性基因,蓝色眼睛为隐性基因。但是事实上两位蓝色眼睛的亲代却能够生下棕色眼睛的子代,显示眼睛色彩的决定并非遵循普通的孟德尔遗传法则,只是这种情形相当少见(大约1亿人之中才有1位)。必须全部四个基因同时决定相同的色彩,才能产生单纯的颜色,反之则出现混合的颜色,如蓝绿色。眼睛的色彩通常在婴儿出生后大约6个月趋于稳定。 上图为根据上述基因研究而推断的虹膜颜色形成原因,可见深棕、浅棕和灰色都是由黑色素的浓淡而引起,蓝色是因为散射而产生的色彩,而红色是因为白化而产生的色彩。当浅棕与蓝色混合,成为了绿色;而红色与蓝色混合,则成为了紫色。 下面我们采用图层20%透明叠加的方式做一系列色谱,以展示不同虹膜(咳咳,这是专业说法 :ha )颜色下色彩的差异(忽略色谱、屏幕输出与所谓固有色之间的色差)。 原色谱 褐色 褐色是最常见的人类虹膜颜色。褐色虹膜含有大量黑色素,深褐色虹膜看起来像黑色。褐色虹膜被认为是人类虹膜的显性基因,但最近的研究认为这不一定正确。 淡褐色 淡褐色的眼睛是瑞利散射和中等程度的黑色素在虹膜前方膜层的组合所造成。淡褐色很难界定。它们被描述成浅褐色或黄褐色。有人认为淡褐色是褐色和蓝色虹膜的中间色。 琥珀色与黄色 琥珀色在其他动物上较为常见,它比棕色更浅,很少在人类出现,又被称为猫眼色。在欧洲比例多,或多是混血儿。 绿色 绿色虹膜是最罕见的颜色。在欧洲的凯尔特人、日耳曼人和斯拉夫人中比例较高;欧洲以外,一些普什图人、土耳其人也有绿色虹膜。 灰色 灰色被认为是蓝色虹膜的变种。是第二少见的颜色(仅次于绿色)。 蓝色 蓝色虹膜在欧洲比较常见,全世界约8%的人口有蓝色虹膜。北欧人如冰岛人、芬兰人和拉脱维亚人约80%以上为蓝色眼睛。 –total– 这样我们重点分析褐色虹膜与蓝色虹膜的色差。 褐色色谱相对于原色谱,灰度降低,紫色、红色、绿色部分增加,蓝色部分减少。 蓝色色谱相对于原色谱,灰度降低,紫色、蓝色、绿色部分增加,红色部分减少。 褐色色谱相对于蓝色色谱,整体明度偏高,饱和度偏高,红色、紫色偏多,蓝色绿色偏少。 要使蓝色色谱达到褐色色谱的程度,要提升整体明度、饱和度、对比度,增加蓝色,降低红色。 这样在现实产生的情况是,蓝色虹膜的人会偏好使用我们认为色彩灰度对比强烈的设计,对暖色反应迟钝。 所以我们看看国外的设计会产生眼前一亮的感觉也是在情理之中 🙄 。 除此之外,需要用心产品设计在不同人群中的适用微差。 –etc– 还想写写关于色盲对色彩的差别,有一点要明确——色盲不是病,色盲的人也可以做设计,并且可以做的很有特色,因为我之前就认识一个色盲设计师,哈哈。其中有很多方式可以实现与非色盲设计师、客户对于色彩的交流。 - [济南印象](https://mdong.org/2010/01/%e6%b5%8e%e5%8d%97%e5%8d%b0%e8%b1%a1/): This content is password protected. To view it please enter your password below: Password: - [终结的王者-Sony Walkman D-Ne830](https://mdong.org/2009/11/%e7%bb%88%e7%bb%93%e7%9a%84%e7%8e%8b%e8%80%85-sony-walkman-ne-830/): This content is password protected. To view it please enter your password below: Password: - [金色的树叶](https://mdong.org/2009/10/%e9%87%91%e8%89%b2%e7%9a%84%e6%a0%91%e5%8f%b6/): This content is password protected. To view it please enter your password below: Password: - [用心碰触冰冷](https://mdong.org/2009/10/%e7%94%a8%e5%bf%83%e7%a2%b0%e8%a7%a6%e5%86%b0%e5%86%b7/): This content is password protected. To view it please enter your password below: Password: - [优雅的骑士——Sony DT 50mm F1.8 SAM & A300](https://mdong.org/2009/09/%e4%bc%98%e9%9b%85%e7%9a%84%e9%aa%91%e5%a3%ab-sony-dt-50mm-f1-8-sam-a300/): This content is password protected. To view it please enter your password below: Password: - [Silverlight 3 OOB (2)](https://mdong.org/2009/08/silverlight-3-oob-2/): 续Silverlight 3 OOB (1) 前文对原理做了简要分析,该篇将针对做部分应用。 总述 在Silverlight 3正式版发布之前,开启该功能,需要修改Properties文件夹下的AppManifest.xml文件。 代码如下: Saving your Silverlight offline. 可设置的OutOfBrowerSettings属性。 ShortName – 程序在桌面或开始菜单中的显示名称。 Title – 程序运行时标题栏的现实内容。 Blurb – 程序的备注内容。 当F5运行该程序时,可以看到下面的菜单: 选择第二项。选择添加到开始菜单或者同时安装到桌面,默认选择开始菜单: 移除离线程序也很简单。右键单击运行中的离线程序,选择第二项: 在Silverlight离线程序中同样可以自定义桌面图标,开始菜单图标等。需要创建四个不同尺寸的PNG文件,16X16、32X32、64X64、128X128。把它们添加到项目中并指定路径,设置图标文件的Build Action的属性为Content。 Images/sl16.png Images/sl32.png Images/sl64.png Images/sl128.png 现在就可以得到自定义图标了。 完整的AppManifest.xml文件。 Saving your silverlight offline Images/sl16.png Images/sl32.png Images/sl48.png Images/sl128.png Silverlight 3 的OOB并不支持对窗体的修改。 在Silverlight 3 以及 Expression Studio 3 (Expression Blend 3)正式发布时,这个OOB设置方式进行了简化。无需设置Appmanifest.xml,你可以在Properties看到OutOfBrowserSettings.xml文件。 A short description of the application. 在Expression Blend 3中,选择Project->Silverlight Projects Options->Enable Application Outside Browser。 Demo 联系人管理器(由微软提供) - [Silverlight 3 OOB (1)](https://mdong.org/2009/08/silverlight-3-oob-1/): 名词解释 OOB (Out of Browser): Silverlight 3新特性之一。在浏览器中运行的Web应用界面与传统桌面软件比起来总是死板,不够灵活的。因此,人们就产生了需求,想在浏览器之外运行web应用。Adobe的Air可以实现这个功能,而Google的解决方案是Chrome里的shortcuts。给Web应用建立了shortcuts之后,就可以按照人们习惯的方式启动这个应用,而界面也很传统软件非常接近了。微软的解决方案则是Mesh,或者最新的Silverlight OOB功能。 原理简析 分离程序 当用户第一次浏览应用程序可能是在浏览器的某个位置。当你的程序支持out-of-browser(OOB)体验时,用户可以通过引起事件分离程序。接着会出现下面的情况: 该动作捕获浏览器(例子中虚拟地址 http://foo.com/mysloob.xap)并创建一个OOB程序。 程序(XAP)需要再一次通过浏览器请求数据。 当XAP下载时,在低信任区域中取得本地存储的元数据,包括XAP的原始URI元数据以及重要的ETag信息(本质上是时间戳)。 首次运行OOB 如果我们关闭程序并再次在桌面上运行程序: 在这种情况下程序会检查它的元数据XAP的原始URI并进行一次请求。对比HTTP的响应数据(代码以及Etag)。如果程序没有更新,程序会正常运行。事实上,程序的检查请求基本上会是这样: GET /silverlight/oob/ClientBin/OutOfBrowser.xap HTTP/1.1 If-Modified-Since: Thu, 19 Mar 2009 03:52:35 GMT User-Agent: Silverlight Host: timheuer.com X-P2P-PeerDist: Version=1.0 Accept-Encoding: peerdist HTTP/1.1 304 Not Modified Last-Modified: Thu, 19 Mar 2009 03:52:15 GMT Accept-Ranges: bytes ETag: “f2e3a81746a8c91:445” X-Powered-By: ASP.NET Date: Thu, 19 Mar 2009 03:55:18 GMT 需要注意的是HTTP 304 Not Modified的响应。没有更新信息发送时我们可以看到没有传递信息。程序不会发生变化。在API层,作用于改变DetachedUpdatesAvailable状态的Application.Current.ExecutionState没有被触发。 用户从桌面运行,程序升级 现在我们更新程序并上传到服务器。用户下一次运行程序时,同样的请求出现: 再一次,请求发送元数据信息。不过这次,有更新了。过程也是加倍的。连同响应发送了新时间戳/ETag,请求同样包括了更新程序。请求会是这样的: GET /silverlight/oob/ClientBin/OutOfBrowser.xap HTTP/1.1 If-Modified-Since: Thu, 19 Mar 2009 03:52:35 GMT User-Agent: Silverlight Host: timheuer.com X-P2P-PeerDist: Version=1.0 Accept-Encoding: peerdist HTTP/1.1 200 OK Content-Length: 15557 Content-Type: application/x-silverlight-app Last-Modified: Thu, 19 Mar 2009 03:56:29 GMT Accept-Ranges: […] - [在Expression Blend 3中快速创建图像笔刷](https://mdong.org/2009/08/%e5%9c%a8expression-blend-3%e4%b8%ad%e5%bf%ab%e9%80%9f%e5%88%9b%e5%bb%ba%e5%9b%be%e5%83%8f%e7%ac%94%e5%88%b7/): 之前在Blend中创建一个图像笔刷需要很多步骤。Blend3中对此进行了改进。 复制一个图像到剪贴板 粘贴图像到Resource Dictionary 打开Blend 3 并选择 Resource标签,选择可定义图像笔刷的资源区域。右键点击App.xaml文件并选择粘贴Paste。 增加下列xaml代码到App.xaml文件中Application.Resources部分 - [空镜头一组](https://mdong.org/2009/07/%e7%a9%ba%e9%95%9c%e5%a4%b4%e4%b8%80%e7%bb%84/): This content is password protected. To view it please enter your password below: Password: - [EVA·破](https://mdong.org/2009/07/eva%c2%b7%e7%a0%b4/): This content is password protected. To view it please enter your password below: Password: - [罪行的另一面](https://mdong.org/2009/06/%e7%bd%aa%e8%a1%8c%e7%9a%84%e5%8f%a6%e4%b8%80%e9%9d%a2/): 依靠虚拟,我们不仅进入了取消现实和参照系的时代,而且跨入了消灭他者的时代。 这是种族净化的同义语,它不仅会涉及一些特殊的民族,而且会穷追猛打所有相似性的形式。 死亡的形式——人们以顽强的治疗避免死亡。 脸形和体形,人们通过外科美容术追求着。 世界的形式,人们通过虚拟实在使人忘却着。 每个人的形式,某一天将通过克隆个体细胞而取消之。 还有他者的形式,因不间断的沟通而正在淡化。 如果说信息是完美的罪行对抗实在的场所,那么沟通就是对此罪行对抗相似性的场所。 不再有他者:沟通。 不再有敌人:谈判。 不再有掠夺者:友好相处。 不再有消极性:绝对的积极性。 不再有死亡:伤风败俗的克隆。 不再有相异性:同一性和差别。 不再有诱惑:性冷淡。 不再有幻觉:过度实在,虚拟现实。 不再有秘密:透明。 不再有定命。 完美的罪行。 - [Expression Design 图标设计](https://mdong.org/2009/05/expression-deisgn-%e5%9b%be%e6%a0%87%e8%ae%be%e8%ae%a1/): This content is password protected. To view it please enter your password below: Password: - [Expression Design人工橡皮擦](https://mdong.org/2009/05/expression-design%e4%ba%ba%e5%b7%a5%e6%a9%a1%e7%9a%ae%e6%93%a6/): This content is password protected. To view it please enter your password below: Password: - [片语(1)](https://mdong.org/2009/04/phrase/): 知识是一种信息,与一般信息不同的是知识具有价值属性。既然知识也是一种信息,那么我们不妨先从信息的传播原理角度来探寻阻碍知识传播的答案。 我们往往这样来描述信息沟通:首先有信息的发送者(信息源),经过信息发送者对信息进行加工处理(编码),然后通过某种途径(传播途径、传播介质)传递给信息的接收者(接受源),信息的接收者在接收到信息后会对信息进行理解(信息解码)后根据自己对信息的理解做出某种反馈给信息的发送者,沟通一定是在某种沟通环境中进行的。以上8个要素构成了一个沟通过程,通常也被称为“有效沟通8要素”,也就是说要做到有效传递信息,这8个要素缺一不可。从这里我们可以看得出,沟通质量的关键在于信息源和接受源,而双方又受限于自己的专业领域、工作经验、学历背景、个人喜好、民族和企业文化等方面的程度至关重要。 不对称相互依赖——同盟就好比一个长期供求合同,价格是固定的,而且反映的是最初某种特殊情况下的供求关系。而当供求关系逐步发生变化,日积月累,与那个最初的固定价格之间的背离越来越严重,那么整个合同的废弃或修正是迟早的事。 一是不能太拿自己的恩惠当回事,究其不能把自己美化为舍己为人的道德楷模,因为那种虚伪态度比如会导致言行之间的背离和盟友之间的离心离德;而是应当把目光集中在当下和未来的“供求”变迁上,保持双边关系的“弹性”;三是应该记住:同盟,是个不安全的产物。盟友获得安全之日,往往是同盟结束之时。 科技的进步越来越变成技术爱好者的自我追求而忽略了消费者较弱的技术需求。 当信息过多,它们变成垃圾的可能性也越大,过多的信息使人产生对有效信息的迷失。 所谓需求,反映的是一种消费者行为过程中的问题,而绝对不能把消费者提出的解决方案误理解为需求。 - [MEDICOM RAH 绫波零](https://mdong.org/2009/04/medicom-rah-lin-bo-ling/): Perfect做工! 来自新剧场版,300mm的PVC材质. 12800 日元(JPY) = 872.1073 人民币(CNY) 零,Babe? : 山。 稳重的山。 是经过时间就会改变的东西天空。 蓝色的天空。 眼睛看不到的东西。 眼睛看得到的东西太阳是独一无二的。 水。 令人愉快的东西。 碇司令。 花。 相同的东西有很多。 没用的东西也有很多。天空。 红色。 红色的天空。 红的颜色。 我讨厌的红色流水。 血。 血的气味。 一个不流血的女人。 由红色泥土造的人。 由一男一女造的人城市。 由人类造出来的东西。 EVA。 由人类造出来的东西人是什么? 是神创造出来的。 是人创造出来的。 我所拥有的是生命。心的容器。驾驶舱。那是灵魂的宝座。 这是谁? 这是我。 我到底是谁? 我是什么? 我是什么? 我是什么? 我是什么? 我是我自己。 这个物体就是我自己造成自己的形状。 肉眼可以看见的自己但感觉上这并不是我。 很奇怪。 我觉得身体像在熔化自己变得难以明白。 我的声音正逐渐在消失。 我觉得有其他人在。 是谁? 是谁在我前面? 碇君。 我认得这个人。 葛城三佐。 赤木博士所有人。 同级同学。 二号机驾驶员。 碇司令。 你是谁? 你是谁? 你是谁? - [Mdongs Space SL Demo](https://mdong.org/2009/01/mdongs-space-sl-demo/): Demo测试 采用Silverlight 1.0版本创建。IE7测试通过。 以下为首页截图。 - [404页面优化体验](https://mdong.org/2008/11/404-page-ux/): 名词解释:404页面是当客户端使用HTTP浏览网页时,服务器需要针对不同的“要求”提供不同的“回应”,譬如浏览器发出HTML文件(网页)的要求,并带有数字回应码和MIME的讯息。代码404的第一个“4”代表客户端的错误,如错误的网页位址;后两的数字码则代表着特定的错误讯息。HTTP的三字符代码跟早期通讯协定FTP和NNTP的代码相当类似。 从HTTP的层面来看,404讯息码之后通常会有一个可读的讯息“Not Found”,许多网络服务器的默认页面也都有“404”代码跟“Not Found”的词汇。 404错误讯息通常是在目标页面被更动或移除之后显现的页面。(引自wikipedia) 为什么需要个性化的404页面 首先看一个关于404的公开投票调查。 问题: 当你遇到一个404页面你会怎样做? A.点击后退按钮同时忘记404页面 B.尝试回到主页并重新定位丢失的页面 C.写信给网站管理员 D.非常沮丧 如果你不在意访客的抱怨,你会发现许多访客在遇到404页面时不会努力寻找丢失的页面而离开站点。然而你可以简单地通过个性化定制404错误页面将这些访客留在你的站点。 如何实现一个良好的404页面 改变服务器默认错误页面就可以达到效果。下面是一些可以使得访客轻松实现正常访问的建议。 遵循的理念: 提供简明的问题描述,消除访客的挫败感。 提供合理的解决方案,辅助访客完成访问目标。 提供个性化的友好界面,提升访问体验。 实现方式(按照从简单到复杂的顺序排列): 使得访客转到某个地方而不是后退。 页面包含该站点重要部分的链接,如主页或站点地图。不要仅仅告诉他们检查拼写。使用文本的链接替代图片,因为有许多访客不会想到点击这个图片。 例子:我们的站点有一个主页的返回链接。这是实现友好反馈的最低限度。 此外,我们还会考虑,在有效的帮助信息不足的情况下,如何通过访客的反馈弥补错误。 需要包括一个指向网站管理员的email链接,或者一个用于提交丢失链接的表格。 相对于发送email,访客更喜欢使用提交表格。 加入一个搜索框用于搜索站点。 例:MSN在所有页面的底部都有一个搜索框,同时也链向站点的重要部分。 在站点中列出接近于访客期望页面的链接,用于推测访客正在寻找的页面。 你不需要采纳上述所有的建议,但是这些建议一致服务于使得访客更愿意停留在你的站点的目的。 合理的404错误页面至此即可以完成了,这将给访客提供许多有价值的信息。 使用重定向 如果你经常检查访客统计,可能会看到某一个页面一直在显示404页面(如:因拼写错误而链接到站点不存在的页面),你可以创建一个重定向页面反馈给访客一个正确的页面。这个方法适用于访客多次访问并返回错误的页面。 重定向与404页面的可以整合使用,你可以使用类似下述内容的说明信息: 对不起,该页面未找到。几秒钟后,该页面会被重定向到主页。 给访客5秒钟时间阅读该信息,之后跳转。 不论你怎么做,小心使用重定向。最糟糕的情况是你重定向到一个不存在或不相关的页面。 使用的方式很简单,下面是一个例子。 content后面的数字是秒数,你可以设定重定向执行前的等待时间。 个性化404页面示例 http://www.galiacho.es/404 http://www.palmflying.com/404 http://www.martinkorner.co.uk/404df http://www.porcupine.gr/404 http://bluevertigo.com.ar/404 http://lumino.us/404 http://www.pen-and-paper.de/404.php - [只是工具](https://mdong.org/2008/11/%e5%8f%aa%e6%98%af%e5%b7%a5%e5%85%b7/): This content is password protected. To view it please enter your password below: Password: - [Silverlight SEO 白皮书](https://mdong.org/2008/11/silverlight-seo-whitepaper/): This content is password protected. To view it please enter your password below: Password: - [浅谈电子杂志](https://mdong.org/2008/10/talk-about-emaz/): This content is password protected. To view it please enter your password below: Password: - [《What Is Web Design》——设计原则](https://mdong.org/2008/09/what-is-web-design/): 最近重读《What Is Web Design》。分享一下精彩片段的节录。 “设计特色需求的客户”是设计过程的核心概念,也是设计不同于艺术的本质所在。 设计的目标就是带来“成功且令人满意的体验”,设计师劳拉里·埃尔本(Lauralee Alben)提出的程式:成功就是使用户能够高效地完成任务,令人满意是指这一过程是愉快的,而不仅仅是满足功能性要求,这种愉快可以表现为美好的、诗意的或趣味的。 设计师如要成为客户目标最高效的支持者,他们需要熟悉或逐渐了解客户所从事的领域。尤其是其中与该设计项目有关的领域。 一个对客户了解全面的设计师可以对客户的一些原有假设以及基于这些假设而作出的战略计划提出质疑。 了解项目本身的特点。首先明确是什么才能使项目成功以及它将被怎样平衡,要辨别项目投资者、推动者、最终决策者以及这些因素之间的相互关系。这三部分人所关注的问题都应在设计师的考虑范围之内,并且设计师需要在不同程度上使他们认同或承认最终设计方案的价值。清楚该项目的所有限制和约束。 了解最终用户使用产品所能满足需求的方式以及他们使用的环境。 对目前及将来社会发展趋势有全面的认识,并且对客户企业文化及相关民族文化的世界文化有相当的认识。 对相关技术及其发展方向牢固掌握,技术也是设计方案的限制因素。但设计不为技术所驱动。 今天看来使用的设计方案未必适合明天。 简明与清晰是两条重要的原则。“事情应当处理得越简单越好——但不能更简单。”——阿尔伯特·爱因斯坦 对某个问题中单个元素的解决方案不应被孤立地考虑。应该做出一个完整统一的解决方案。 明确的设计程序将带来一种集体意识,保证高效率的合作以及设计方法的顺利推进,并帮助客户及设计工作人员更好地理解这个项目,并因此提供更高效的支持。 高效的沟通与前者同样重要。高效沟通建立的基础,是对设计过程、对产品开发中涉及的所有角色、对过程中投资者的利益等清楚准确的理解。要达到高效沟通,必须避免使用行业暗语和模糊表达。 反复设计与测试。可以由某些设计专业人员或熟悉该产品应用领域的人员以及典型用户代表进行操作。 在反复进行评估过程中,设计师可以对该项目及最终成功的反思和斟酌中受益。这些思考不是为了责备和批评,而是为了让设计师和其他所有项目相关人员认识到怎样才能做得更好。 设计总是在客户和对象用户等带来的动力驱动下活动。设计的最终角色是客户与对象用户之间的媒介。所以应当避免专家主义与道德主义。 - [Silverlight Tips(3)](https://mdong.org/2008/09/silverlight-tips3/): 在PowerPoint中插入Silverlight项目 在做幻灯片演示时用得到。 适用版本:PowerPoint XP/2003/2007。Silverlight 1.0/2.0。 思路:利用PowerPoint支持的WebBrowser控件,创建Silverlight的运行环境。 Demo下载[download id=”2″] Private Sub CommandButton1_Click() Dim varURL As Variant varURL = “file:\\\C:\Documents%20and%20Settings\Administrator\桌面\SilverlightSite2\Default.html” Slide1.WebBrowser1.Navigate varURL End Sub Private Sub WebBrowser1_StatusTextChange(ByVal Text As String) End Sub Silverlight粒子系统 Demo演示 源码下载[download id=”3″] XAML文字竖排 使用MatrixTransform对象。 最近在用SL做片头,慢慢来吧。 - [在Silverlight中整合HTML页面](https://mdong.org/2008/08/silverlight-mix-html/): This content is password protected. To view it please enter your password below: Password: - [谈谈兔子的《关于浏览器的一些观点》](https://mdong.org/2008/08/about-browser/): 2011/4/21注:此文已被《UCDCHINA火花集2》收录。 早上在蓝色理想的更新推荐里看到了这篇文章。总感觉有些不舒服的地方,随便说说。 [coolcode]浏览器的出现 互联网的出现是人类信息交流方式的一次划时代的革命,在这场革命中有两个技术对互联网的发展起到了决定性的作用:一个技术带来的人类信息交换方式的改变,人们普遍的使用电子邮件时信息交流方式;另一个技术则是由伯纳斯-李和安德里森带来的网络使用方式的改变,人们普遍的使用万维网和网络浏览器。 网络浏览器的出现,不仅使超文本文件格式的优点得到了充分的发挥,而且也使对互联网用户的技术要求降到了最低点。不用任何电脑方面的知识,不用经过任何训练,只要用一个小小的鼠标,就可以操作。正是浏览器的使用,才使得每个人都可以享受到上网的乐趣。 浏览器是桌面系统的掘墓者 从浏览器诞生之日起,就成为了互联网扩张势力的神兵利器。Google以浏览器为自己实力的施展平台,为用户提供着具有丰富想象力的,具有良好用户体验的一系列产品;在线文件处理系统、在线日程安排等日益威胁着以微软为代表的传统的桌面文字处理软件系统。 在传统的桌面软件时代,用户必须在自己的电脑上安装不同的软件来获的不同的需要,虽然很多时候很多软件都很少用,我们必须要安装,必须要给这些软件留出很多的储存空间;而在互联网时代,我们可以把软件储存在一台远方的服务器上,当我们需要的时候,就可以从该服务器上直接调取就可以了,我们不再需要把他安装在本机了。我们都可以把应用软件的端口都整合在浏览器的平台上。[/coolcode] 诚然浏览器的诞生,促进了互联网的发展。而互联网的发展,推动力确不仅仅是浏览器。深层原因是人对互联网服务的需求。 浏览器只是一个实现需要的工具,而且又受制于其载体——系统平台。 浏览器真的是桌面系统的掘墓者么? 我认为,浏览器与系统平台是一种寄生关系。 Mosaic起于Unix,由于在Mac与Windows平台的推广而普及。 Netscape风光无限,但为什么会败在IE手下? 与时下Firefox、Opera的功能强大、高效相比,IE甘拜下风。 但是为什么后者的市场占有率仍然高达70%以上,无数的网站前台人员将对其的兼容性测试置于首位? 原因归为一点,微软主导了系统平台从而主导了浏览器市场。 看起来Google的在线服务非常强大,甚至有超过微软桌面平台的势头。 但是,请清醒一下。 你不担心数据安全性么? 你会将重要的公司数据档案交给Google编辑管理么? 你有应急措施,在Google服务器突然出现故障的一天,保证业务的正常运转么? 显然,答案只有一个——在本地存有备份,并能够在本地平台编辑管理。 因此建议将类似Google提供的一些在线服务做为第二选择。重要数据仍应由桌面平台处理,比较重要或者可有可无的服务酌情在存有本地备份的情况下转移到网站的在线服务。 [coolcode] 浏览器时代的用户体验 因为浏览器的出现,使得使用互联网的技术门槛已经降得很低。不用任何电脑方面的知识,不用经过任何训练,一般的普通老百姓就可以操作。所以使得浏览器时代的用户体验设计变得更加复杂和多样化。不同层次的用户对于浏览器着不同的心理和生理上的感受,所以浏览器的个性化设计就是用户体验的一个重要方向,我们需要为不同的用户设计出面向不同的需求的浏览器。另一个方面是浏览器作为一个各种Wed服务接口的平台,其平台设计的易用性是很重要的一部分,毕竟对于用户来说浏览器只是一个中转站,浏览器本身并不提供信息内容,所以对于浏览器的设计来说,怎样设计好其跳转、怎样设计好众多信息接口的布局和信息构建就是比较重要的内容了。[/coolcode] 当前廉价的硬件使得人们更有愿望来利用本地客户端的强大计算能力实现需求,对浏览器的需求将大大降低。 如有一个简单的调查,您是喜欢基于浏览器的游戏,还是喜欢由客户端执行的网络游戏。 事实是后者将占有绝对优势。 带宽的持续增长使得基于Internet网络交互更为丰富,人们对互联互通的需求持续增长,简单的B/S结构已经不能适应。这是一个趋势。 观察一下IE最近几个版本的公布时间,IE5(2000年) IE6 (2001年) IE7(2005年) IE8(推测2009年)。 可以发现,微软正在逐渐放缓对浏览器的研发,而将网络实现的注意力转移到桌面平台之上。 当前的Silverlight技术也只是一个由浏览器到桌面平台的过渡产品。 在平台发展的带动下,浏览器所实现的功能将会由桌面平台瓜分。 浏览器将和RSS合作主要用于静态信息展示,绝大多数动态的计算任务将交给“网络服务+胖客户端”。 一家之言,给大家增加一些饭后的谈资。^^ 下面提供一个强大的桌面搜索引擎,基于WPF。 下载点击这里。 - [Silverlight Object 标签的结构](https://mdong.org/2008/08/silverlight-object-tag/): 接上一篇《呈现Silverlight:HTML vs. Script》 E文 水平有限,出现不准确的地方请指正。谢谢。 Silverlight 2 的安装模型使用Silverlight object标签模板。在上一篇文章《呈现Silverlight:HTML vs. Script 》提到过,这个模板的设计遵循的5条标准: 1.兼容Silverlight1.0。 2.仅基于静态的HTML。 3.为客户端提供合适的安装文件(Mac,Windows,其它)。 4.为不能够使用Silverlight的用户提供可行的反馈。 5.提供一个易用的可定制的安装升级体验。 这篇文章会解释上述标准在模板中如何体现。 [coolcode lang=”xml”] [/coolcode] 示例1:Silverlight 2 Beta 2 object标签模板(局部) 兼容Silverlight 1.0 Silverlight 1.0安装/实例化模型建立在一个名为Silverlight.js的JavaScript帮助文件之上。这个文件拥有一系列参数,通过函数与参数的使用将Silverlight控件嵌入网页的DIV标签内。Silverlight 2控件在IE中使用object标签嵌入DIV标签,而在Firefox与Safari中使用embed标签。 在未定义classid的object标签中使用MIME类型,一个网页即可在支持Silverlight的浏览器中正确地实例化Silverlight控件。当浏览器的classid属性不一致甚至不兼容的情况下,MIME类型定义的类型属性都能以相同的方式被解释。因此,在object标签中使用类型属性,能够满足Silverlight 1.0与Silverlight 2控件通过一个单独的HTML标签进行实例化。 仅基于静态的HTML 脱离对Silverlight.js模型中的js依赖: *一些虚拟主机不允许用户在网页中加入JavaScript。 *在一个网页中加入一个应用程序需要作者同时连接应用程序与Silverlight.js文件。 *不开启Silverlight的浏览器不能够访问Silverlight内容。 你需要安装控件以查看内容。 如果在浏览器有一个控件映射到“fake/mimetype”MIME类型: 运行时浏览器中object标签与param标签将被忽略: 你需要安装控件以查看内容。 当Silverlight不可用时,Silverlight object标签模板会使用下面的应急机制显示安装提示。如果已经安装Silverlight的用户访问一个Silverilght页面时,Silverlight应用程序会正常显示。如果用户没有安装Silverlight时,浏览器会忽视Silverlight标签并显示嵌入的HTML。默认情况下,用于Silverlight 2 Beta 2的HTML: 将呈现如下UI元素: 为客户端提供合适的安装文件 如果你查看用于HTML安装的默认Silverlight object标签模板,你会注意到一个a标签链接到Silverlight 2 Beta 的地址:http://go.microsoft.com/fwlink/?LinkID=115261。在Silverlight.js文件中,为各个操作系统提供了唯一的安装地址:适用于Windows的.exe、适用于Mac的.dmg,以及一个未知平台的链接地址。在Silverlight 2 中微软将这个侦测功能转移到了服务器端。当用户运行到上述的安装程序地址,服务器会为这个用户侦测适用的安装程序。如果可能,安装程序会打开安装程序而无需离开当前页面。如果浏览器不支持Silverilght,如64位的IE,这时会跳转到一个微软的网页,告诉他们关于安装Silerlight控件的平台要求。 服务器端的工具是很有用的。第一,一个网站只需要为控件提供一个单一的下载地址。第二,网站作者不必担心用户的操作环境,如不支持的平台。第三,如果先前一个不支持Silverlight的平台得到支持,这时使用这个单一地址的网站会自动的为那个平台提供支持。 提供给用户可行的反馈 这个部分包含了先前的一些章节。如果侦测到部分用户系统中Silverlight不能正常工作。有3个可能的原因: *不支持的操作系统。 *不支持的浏览器。 *不支持的64位浏览器。 在确定向特定的客户端提供安装程序之前,系统会检查上述条件。如果碰到其中的一项会发送给用户一个微软的网页告知侦测到的问题。在有些情况下,系统会告诉用户他们的操作系统不被支持。在另外一些情况下,用户会被告知他们应该更换一个被支持的浏览器。在使用64位浏览器时,用户会被告知使用32位浏览器替代64位浏览器。 这个系统会跟随由错误造成的问题而升级。这个系统的目的是,避免用户陷入安装的死循环。这样做的原因是将检测环境的责任由网站作者转移到微软。 其它的模板元素 data=”data:…,” 有两个object标签模板元素,他们的作用不是太容易理解。object标签的data属性与iframe标签。 Silverlight object标签增加data属性是在Silverlight 1.0发布不久。如果我们增加object标签到一个网页,而没有在object标签中加入一个data属性,浏览器就会忽略包含object标签的html文件。我会用这个例子说明它: test1.html ————————————————- ————————————————- 当被浏览器运行时,网页会呈现这样的效果: test1.html ————————————————- - [Silverlight创建运动路径(motion path)](https://mdong.org/2008/07/silverlight-create-motion-path/): 大家知道在Flash中有一个引导层功能,可以辅助完成丰富的动画制作. 于是有人疑问Silverlight中是否有类似功能. 答案是否定的——Silverlight并不支持. 然而在WPF却有运动路径(motion path),效果类似于引导层. Silverlight受限于浏览器,为了保持小巧的插件体积,如上述功能就被摒弃了. 接下来有一个解决方案,可以使Silverlight如WPF一样,支持运动路径(motion path). 请先下载这个WPF项目. 这个WPF程序的功能是将在Blend中编辑的动画,通过它将WPF动画转化为Silverlight可用.操作如下: 1.用Blend打开harness目录下的项目. 2.在画布中的空白区域绘制图形,目的是利用运动路径(注意取得图形元素的XAML). 3.F5运行WPF程序.调节相关设置Animation Name、Element to Animate、KeyFrame type、Frames per second等. 4.复制取得动画的Translate X,Translate Y值. 5.打开所要操作的Silverlight项目.将第一步取得在图形元素XAML载入.创建新的时间轴,粘贴替换上一步取得的Translate X,Translate Y值. 完毕. 上述方案会产生许多冗余的代码,但仍不失为一种好的尝试. 延伸阅读: 所用WPF的作者原文 蓝典Silverlight专版 - [关于scRGB](https://mdong.org/2008/07/about-scrgb/): scRGB是一个色彩管理模型,曾用名sRGB64,由微软主导的用于Windows Vista中GDI+API的RGB(Red Green Blue)色彩空间.它与sRGB采用相同的基色以及黑白点,但是使用了16位的浮点线性值替代了8位的整数压缩gamma值.它允许取值超过[0..1]的范围,取得更广阔的色域. 举例:scRGB由64位编码及16位单通道(bit per channel–>bpc),每种颜色超过65,000级,与此同时,sRGB是8位编码,仅有256级可用. 参考资料: WPF: Welcome scRGB – New friend of Red, Green, Blue ExtremeTech: Defining scRGB - [呈现Silverlight:HTML vs. Script](https://mdong.org/2008/06/silverlight-html-script/): E文 许多Silverlight开发人员注意到Silverlight的安装呈现模型在Silverlight1.0与Silverlight2.0之间有着根本的区别.Silverlight1.0依赖一个JavaScript帮助文件——Silverlight.js,供于插件的安装体验.Silverlight2.0的项目却脱离了JavaScript模型,转为一个更为常见的标签模型.这就带来了一些问题:为什么1.0使用Silverlight.js?为什么2.0使用<object>?更重要的是,哪一个模型更适合我? - [Web Desgin Tips(1)](https://mdong.org/2008/06/web-desgin-tip1/): 今晚有幸与一名资深Web设计师Berry聊天,写点感触. 关于SEO 他向我了展示最近完成的一个网站(www.larsenfabrics.com).我提出关于其网站未定义meta标签的疑问. 回复曰:This site was designed for registered stockists,and trade suppliers/customers,if you found it as an individual, you would not be able to order from it,so no need for SEO. meta tags are being overlooked now by Google… so you are no longer able to enter keywords… as many metatags don’t replicate what the content of the site is.. so Google see’s the site as spam. 译:这个网站的客户是一个合法的批发商,交易对象是零售商与消费者.如果是你,以个人身份找到这个网站,你是不会从上面提交订单的,所以不需要SEO. meta标签将要被Google忽视..所以你不再会键入关键词…许多meta标签并不能完整的反映出网站内容..这样Google会视之为垃圾信息(spam)… 我的理解:这个网站的客户,依赖线下交易与宣传.网站建设的目的,旨在增加一个展示与联系的平台.SEO可以达到网站搜录优化的目的,但对于网站主的业务来说,并不具有实际效应.因为对于消费者,让其在一个从天而降的B2C/B2B网站上填写真实的个人信息,是一件几乎不可能的事. Google的算法更为智能,投机取巧过分SEO也非明智之举.进而鼓励我们专心网站结构与内容的建设. 关于Web标准 良好的网站结构是一个优秀站点的必备素质.在他的几个客户站点中体会到了这一点.前端代码没有冗余,结构清晰,一目了然.是下狠心学习Web标准的时候喽.. 关于Berry与精神 让我惊讶的是,Berry竟然已经36岁了.在国内,真没听过有这么大年纪的Web设计师… 😀 原因也许是因特网在西方比在中国发展更早而且健全,所以网站相关的设计/开发人员也并非国内的相对低龄化. 即使是这个已经看起来”很老”的设计师..也一直没有放弃对新技术的学习. 与他取得最初的联系是在Silverlight.net.佩服. 访问文章中提到的网站,下面的代理也许用得到. [coolcode]83.170.113.182 80[/coolcode] PS:我会在接下来的时间,试着写一些有关Berry网站的界面交互的内容. ## Pages - [About](https://mdong.org/about/): This is a personal weblog. He is an interaction designer and UX manager. He keeps up with the related original design/technology points on his weblog. Thanks for your interest. Contact WeChat: mdongorg [comment]: # (Generated by Hostinger Tools Plugin)