BeFor Web
为网而生 - 原创译文博客 - 关注移动互联网及AR/VR产品的用户体验设计

原型

优秀的用户体验设计师应该做好的五件事 »

一大早又梦到了南开中学。一如既往的回到那里见了老朋友,然后一起去后街淘打口磁带和杂志。梦境中的情节没有让当时的自己感到哪怕一点点的时空穿越,只觉得一切都很真实而正常,反倒是醒来之后感到眼前这一切有些突兀,空白了几秒才想起自己正躺在哪里。

静的几乎连小猫睡觉时喘息的声音都能听的到。把这篇译文放上来,然后去放放空。回头看看一直以来做的内容,似乎能够发现自己所走的路径,也能够回忆起在某些时间段内发生了什么,导致自己关注的方向产生了怎样的微调,blah blah...没有欲望多说什么,觉得什么东西关闭掉了的样子。进入正文吧,小小的一篇东西。

谁都会画线框图。当我(英文原文作者)的朋友们谈到自己的产品idea时,我会鼓励他们拿起纸和笔,通过草图来交流想法。他们觉得这种做法很棒,可以帮他们把头脑中的想法落实到实际当中。

真正的用户体验设计师并不是由画线框图的能力所造就的,更重要的是,他们懂得怎样处理回馈信息,怎样验证想法,他们懂得做调研和迭代。他们知道草图和线框原型只是整个设计流程当中的一小部分,它们是调研工作的结论产出,是用来做沟通的信息载体;它们有可能被放到演示文档当中供产品、设计、技术开发等相关人员进行交流沟通,也有可能以高保真或纸面原型的形式被用作可用性测试。

凌乱中的艺术 - 草图原型实战技巧 »

五年时间转瞬即逝,在自己小窝的最后一个周末;眼看着家当和心情都被打包的差不多了,整个人却终于感冒发烧腹泻垮了下来,这是闹哪样呢。所幸本周前面几天可以抽出些时间做掉这篇译文,今天发掉先。接下来的两个月,大概要集中业余零散精力放在一本iOS书的翻译上了;希望还能有些时间分给这边。杂七杂八就到这里,我们直接进入正文——草图原型实战技巧,没有务虚的大道理,每个内容要点都很实用。走着。

在如今的用户体验及产品圈子里,越来越多的人开始了解到草图及相关的原型工作对于整个设计流程的重要意义;不过在实际工作中,真正会拿起纸和笔的人貌似不是很多。作为一名用户体验设计师,我(英文原文作者)每天都会画草图,我还霸着办公室的一整面墙,在上面铺满草图,标注着各种上下文情景脚本。

确实,使用电脑中的原型设计软件代替纸和笔,在很多时候是一种省时省力的做法,不过从可视化与实体化的角度来看,这并不是最好的解决方案。当你正在构思网站页面或是移动应用的布局,琢磨着功能流程及上下文情景脚本的时候,拿起笔画画草图才是更加直接有效的方式——它可以帮助你集中精力解决眼前的问题,尽情的勾勒各种想法,而不必为工具软件的使用方法或功能限制等方面的因素分散注意力。

很多文章都会告诉你草图这东西有多给力,但是基本不会从实战的角度进行深入而细致的讲解;本文则不然,我会实打实的从具体执行的角度,向大家介绍一些常用技巧及其背后的道理,这些都是我和其他很多用户体验设计师在每天的工作中所要用到的

Web应用的成功之路 - 产品早期的原型设计与用户测试 »

最近一阵有些难以抑制的脑痒手痒,阅读和码字的欲望也渐增;却受时间精力等绝对客观因素所限,不得不维系一周一篇译文的频率,感觉多少有那么点沮丧和无奈。

关于本文,其实在标题上犹豫了蛮久。这篇内容是新书A Practical Guide to Web App Success的第15章;主题显然应该在Web应用方面,但是本章单独拎出来看的话,却又适用于各种常见类型的Web产品。whatever,不矛盾。作者Dan Zambonini在本文中将向我们阐述Web应用在原型阶段的设计与测试工作的重要性,并从实际执行的角度出发,介绍一些经验方法和常用工具。走着。

产品在原型阶段的设计与测试工作,是决定一款移动应用能否成功的重要因素。提到原型设计和用户测试,人们往往容易产生厌倦与回避的感觉。这也不奇怪,在很多实际项目中,这方面的工作似乎就是“随意性强”,“耗时”,“高成本”一类的代名词。

不过在我看来,它们其实是整个设计流程里最重要的环节。无论你或你的团队在用户界面视觉设计等方面有多高的造诣,我都建议各位对原型环节的相关工作提高重视。基于高保真原型的用户测试,可以让很多关于需求、功能、界面设计等方面的潜在问题尽早暴露出来;这类问题往往直接关乎着产品的成败

Foundation框架 - 快速创建跨平台的网站页面原型 »

整个一周都在揪心的猫事中度过。从十月底到现在的这段日子里,倒是越发懂得珍惜每天中片刻的宁静时光。有时会怀疑家里是否有时空漩涡一类的东西,不然钟表怎么会走的那么快,一点儿也不愿停下等等我的样子。一切都会好起来。

独白终了,进入正题。最近两篇译文都有涉及框架和跨平台方面的话题:前一篇中,我们了解了一些用于移动应用开发的前端框架工具;今天这篇的立足点偏向设计开发流程的上游,它将向我们展示怎样使用Foundation框架快速创建跨平台的、可以在多种设备上进行测试的响应式页面原型。下面开始正文部分。

开门见山的说,作为网页设计和开发人员,我们面临着以下几个严峻的问题:

  • 每天,人们用来上网的设备种类和数量都在不断上升。
  • 为每种设备设计开发不同的界面是不可能的。
  • 即使你专门为某些设备定制打造,这些设备也很有可能在不久的将来退出主流舞台。

真心欢乐。别怕,大家一起面对并解决问题。其实,不同类型的设备及屏幕的这个问题,很早以前就开始存在了,只是多年来我们一直忽视这个状况,一厢情愿的守着960像素的网格系统

案例学习 - 响应式网站的产品需求和设计流程详解 »

今次的译文中,我们继续响应式Web设计方面的话题。前面的几篇相关文章以概念诠释、方法说明为主,本篇则围绕一个实际网站案例展开,从需求、流程、步骤细节等方面描述了响应式设计在项目中的实践方式。

本篇的部分内容要点会与之前几篇产生交集;我们会在这些地方提供相应文章的入口,便于深入参考阅读。接下来进入正文。

根据DailyTech的统计,到2015年,移动互联网的用户数量将会超过桌面用户。除了智能手机之外,使用平板电脑甚至是电视机进行上网的用户也在持续增加。在这种形势下,怎样让我们的网站尽量兼容各种类型的设备,并确保优良的用户体验,这将是越来越重要的问题。

通过响应式的设计开发方式,我们可以使网站页面随浏览设备的不同而自行响应,动态的调整布局结构、元素规格样式,将相同的内容以不同的格式呈现给不同设备的用户。

如果你对响应式Web设计还不大了解,可以先参考阅读我们之前的关于响应式设计的概念、组成要素及基本实现思路方面的文章,全方位预热一下。

线框原型(线框图)的本质及实践应用概述 »

家里小猫生病,从周二开始一直折腾到现在,仍在治疗与观察中。几年来经历过几次这样的状况,虽然每次都会恢复健康平安,但一旦再次置身这样的过程里,怎样也无法停止焦虑与担心。除了尽心尽力以外,能做的只有不断祈祷,期盼着一切安好平安的状态早日回来。

篇幅不长的一篇文章,也因为这样的状况而拖沓了多日;一方面没时间,一方面没有任何心力的感觉。不多说了,我们来看今次的译文。

如今的设计圈子里,线框原型(线框图)这个词正在越来越多的被提起。过去几年中,在软件和Web设计等相关行业里,线框原型得到了迅速的普及,同时也带来了很多的误解。它的概念甚至在慢慢的被扭曲,使新手在入行时往往不能正确的理解它的用途。

问题出在哪里呢?最近,我(原文作者)与一些设计专业的学生进行了交流,他们问到不少关于线框原型的问题。通过这些问题,我发现他们对于“线框原型”这个概念的心智模型与其本质相去甚远——在他们的理解中,这个概念包括很多涉及视觉设计方面的因素。更糟的是,他们甚至不愿意去做线框原型方面的事情,他们只知道这是流程中的一个需要执行环节,却不明白它的重要性。这事弄的我相当郁闷,最初,我觉得这搞不好只是个例而已,但通过对行业内的现状进行观察,我逐渐发现,线框原型在很多项目流程中的执行情况真是够惨不忍睹的;原因来自很多方面,包括客户、设计新手、产品决策者等等

Pages