BeFor Web
为网而生 - 关注互联网及移动端产品的用户体验设计

前端

Web设计先驱Jeffrey Zeldman访谈 »

又是一个白天湿热如夏,晚间秋意尽显的周末。我非常乐于抱怨这魔地的天气。

戒掉朋友圈已经第三周了,期间在每个周日会弥补一些,然而在平日越发觉得可有可无了。起初进入微信每每看到“发现”tab上的红点就会骚动,日子久了也便熟视无睹起来,甚至有种“排除毒素一身轻松”的感觉不知怎么回事。有谁知道前面这八个字是过去哪家药品的slogan吗?

上周末和优设的同学做了一期访谈,关于个人职业经历、交互与产品设计观念、ISUX团队、音乐与生活等等方面,又是那种写着写着又收不住的感觉。自己也发现了,只要不是做译文,就怎样都想把脑子里那些乱七八糟的念叨个明明白白,每每搞的脑浆好似要从耳洞流出,自己也是难过,但乐此不疲。

而本周又恰巧读到这样一篇Jeffrey Zeldman访谈 - Interview with Jeffrey Zeldman: A Candid Look at the Life & Work of a Web Standards Pioneer。宗师级Web设计师的心声,而且如作者所说“充满了个人化与直率的色彩”,读过之后无论如何都想拿来在本周做掉了。其中一些关于创业伙伴和他们举办的设计大会的内容,在主题上略偏,也就过掉了,有兴趣的同学可以访问原文。下面进入译文。

任何从事互联网设计工作的同学或许都听说过Jeffrey Zeldman的大名。作为现代互联网标准的最大贡献者之一,他在Web这个行当里做事的时间怕是比我的活过的年头都长。

能对他进行访谈,并将他对职业、生活及互联网设计的深挚热情分享给各位,对我来说是非常幸运的事。

念叨 - 关于年轻的朋友、咖啡、iOS开发学习 »

之前在汇总本周文章的时候,很偶然的在Medium看到一篇关于Kurt Cobain的文字,加之确实没有哪篇设计文章让自己很有心情去做译文,于是琢磨着要么这周翻这样一篇音乐的东西吧,换换脑子。当时在公众号(beforweb)和自己的朋友圈里征询了一下大家的看法,其实就是这事。得到了好多支持,还有一些朋友给出了其他方面话题的建议,在这里再次谢过大家了。

意愿是真切的,实际执行时认真考虑起来却发现当时看到的那篇以及之后又浏览了的若干相关文章,相对于这里的基调来说,确实是太过阴暗了些,毕竟,关于Cobain,关于Nirvana,关于Grunge,关于西雅图,这些方面的话题从通常意义上讲很难正面起来 - 充满关于自杀的探讨。我希望偶尔发一些更个人化的、不是通篇设计产品一类话题的文章,但也不想搞到让多数朋友觉得陌生或是太过反感一类。

所以想想看还是放弃了那篇。正好周四晚间和一个小朋友交流着关于交互职能的话题,有感而发,于是将彼时彼刻自己的想法、状态串联成一期念叨,作为本周的更新好了。没头没尾的东西,旨在以更加个人化的形式与大家有的没的瞎念叨吧。

念叨 - 关于Sketch、Origami、Swift及Apple Watch »

周末,清明,所谓弹簧式天气,夏日般的高温,高温之后的风,雨,乌云,尴尬的阳光,一屋子猫毛,Pearl Jam MTV Unplugged 1992,威士忌,扔在门外的Air Force 1,晚间21:55,凌波丽,Eddie Vedder正在绝望的嘶吼“We belong together,together”,目光神经质且坚毅着。

翻开朋友圈满眼都是精致的文艺的酒吧餐厅餐盘美食小清新民谣Live吧啦吧啦...just fuck off...

话说,这周没有看到像样的或是愿意做的文章,想想就自己念叨念叨好了。从来都只是在正式译文前念叨,这次搞大了;记得以前有些朋友评论说每篇开始的念叨属于信息噪音,尽快进入正文才好;也是个角度,不过抱歉今次怕是没正文了,都是念叨呢。我几乎把自己逗乐了。

当然念叨的也是正经东西居多,只是随性了吧,毕竟不是一板一眼的做译文或团队博客,脑子里没什么中心思想啊框架啊提纲一类,想哪说哪好了。谁知道会不会念叨上瘾以至于以后越来越多这样呢。谁知道。

怎样从Sketch向Xcode自动导出图形资源 »

不太明白为什么元旦假期这么快就到最后一天了;不太明白为什么下周一的气温有21度,周二又降到8度;不太明白为什么到现在我还是一遍一遍的看着《编辑部的故事》。

不太明白为什么在本该安心的守着家人开心祥和的夜晚在外面看到那么多人拥挤在一处却仍要一门心思的扎进去只为什么跨年狂欢。还有多少人长着正常的人脑子?

我不觉得是我太宅了或是心态太老了。我觉得很多人错了。有些人还有知错的机会,有些人已经没了。

我也不觉得这些絮叨是负面的。话说今天这篇只是讲了一个实验性的小方法,不使用Sketch和Xcode的同学其实无需浪费时间了。下面进入正文。哦btw,新年快乐。

Bohemian Coding(Sketch的制作团队)发布过一款名为SketchTool的命令行工具,用来自动导出.sketch文件当中的界面和切片。

越来越多的设计师和开发者开始在iOS开发流程当中使用起Sketch。通常,整个流程中会包含很多重复性的工作,例如在Sketch当中修改设计方案,重新导出,然后将更新后的图形资源移入Xcode的Asset Catalogs当中,并再次运行Xcode项目以查看实际效果。

而通过SketchTool配合Xcode,这些都可以自动化完成。

怎样在Xcode 6中使用矢量图形 »

周末又要过掉了,沮丧。眼看进入深冬了,天气却越发春意盎然。话说2014年就要过去了么。这一两年下来,已经不太敢期待新的一年了;谁知还会有什么样的事情发生。

我发现自己在周末两天里会花费越来越多的时间玩游戏了。常年GTA,像是逃进另一个世界。IV,V,或是iOS上的SA,沉浸在里面,一点都不想出来。玩来玩去还是SA的感觉最暖最安心;游戏当中本就是初夏时节的LA情景,加上自己在2008年从5月到10月宅着的日子里时常在玩(当时还是PC,怎样也不会想到若干年后可以在手机或平板上玩;那年我在用诺基亚的歪脖子音乐机),所以现在一旦进入SA就会立刻感受到那种夏天的味道。

说正事儿吧。今次略技术向;其实已经见过汉化,我只是想自己做一遍。之前捣鼓了点东西,要适配6和Plus,自己做做切图才发现确实有够烦。基于矢量图生成PNG图形的方法也是事后才知道,学习下,希望接下来可以实践。下面进入译文。

iOS应用的视觉形式通常是以图形元素驱动的。在设计开发一款应用时,你需要不同规格的应用图标,例如不同尺寸的Default.png图片,同时还需要为UI的实现准备@1x和@2x图形资源。所有这些图形元素都会让你的产品看上去更吸引人,但弊端也是很明显的 - 你需要为每种规格的图形元素单独切图。而随着iPhone 6及Plus的发布,我们又多了一套@3x需要处理,事情变得越来越复杂。

幸运的是,苹果在Xcode 6当中给我们带来了一些很棒的工具用以管理图形资源。更棒的是,新的工具和实现方式可以帮我们从容的应对未来的iOS设备,例如基于Storyboard为iOS 8设备生成启动图片,这样你就无需再为不同的设备类型单独制作。此外还有一个非常重要的新功能,就是在应用构建阶段基于PDF图片文件自动生成各种规格的图形资源。本文中,我们就来一起探索一下这种能帮你节省大量时间成本的方法。

设计师+Xcode:突破产品开发的流程界线 »

入冬之后,喵的状况又有些让人牵挂;换季时节似乎特别容易不稳定;只是记得从前6年多没有这样的情况,而从去年开始喵的事就成了我心里最大的事。

和上周差不多,仍是看着小握的游戏解说,空调暖暖的;不同的是现在手边放着40度苏格兰保健饮品,还有一些麻辣零食;当然译文不是边喝边做,目下只是在把引言补完。我去了,这也能叫引言。

话说其实是强迫自己本周不做Apple Watch主题。一篇小文,好像随口讲了些故事而已,关于视觉设计师直接使用Xcode打造界面以提升产品开发效率的话题。必须说,要达到“iOS前端”的程度,很难不依靠一定程度的代码工作,但值得一学,值得一试。另外,读过这样的文章后,也会从另外一些角度来看待苹果从iOS 7开始推行新设计语言的一些初衷 - 让设计师和开发者都可以相对轻松一些的在开发环境中创建界面,实现设计方案。下面进入译文吧。

今年年初,我们团队与瑞典的一家叫做Billogram的创业公司进行了交流。他们希望通过更流水化的发票处理程序帮助中小型公司改善现金流状况。在初期的探讨当中,我们看到了将他们的服务移动化的巨大机遇,那将能够使客户随时随地把控他们的财务状况。

腾讯ISUX(上海) - 招聘交互、视觉、用研、前端 »

诶明明中午刚刚发过新文章;下午馋了出去吃了个汉堡王到现在打嗝还是牛肉味真满足;现在又来喽,会被嫌絮叨吗?

这事儿就开门见山直说了。常来常往的朋友都知道这个C最近刚刚入职腾讯ISUX团队(上海),也就是社交用户体验设计组。好棒的团队,从我个人来说,已经好多年,没有过这种感觉了,像是每个团队成员都有那样一股能量,让你觉得有什么东西不断扑面而来,使自己被感染和推动;特别“对”的感觉。

那,现在UX铁四角职位(什么词儿这是,我又乱发明了)均有开放,工作地点上海漕河泾:

  • 交互(资深向)
  • 视觉(资深向)
  • 用研(要男生;老大要,不是我要)
  • 前端(iOS开发向)

希望和一群年轻有为又有才、像风一样在我们热爱的设计世界中奔跑拼搏的小伙伴们一起工作和成长吗?联系我呗,微信(Coda7210)或微博(weibo.com/c7210)都好,详细情况俺们小窗说。

周末过去了,明天是正经清明节了;各位假期快乐!仅一天!

漂亮的视差效果,值得你用性能来换取吗? »

自从元旦假期开始,就有点肾疼...也许是那几天里咖啡因和酒精摄入的太多。眼下吃什么什么不消化,浑身脑袋疼。这状态让我想起2010年初那段日子了,持续两三个月的莫名其妙的低烧,然后是一个多月的肠胃问题,折腾了半年也没查出个所以然。恐怖哦。

希望一周之后自己回头看今天博客的时候已然无恙。继续上新,关于视差效果性能表现的小话题;弱问,各位见过的使用视差技术的Web页面里,有多少能让你觉得清晰顺畅的感受不到任何负面体验?我印象里真的没几个,包括Medium里的;不知为什么,这些页面总让我觉得没有安全感。本文篇幅虽短,但主旨很清晰——针对产品主要用户群体的特征来选择最合适的设计方案,别瞎跟风。

这里进入译文。我(英文原文作者)最近在ThemeForest(模板站)逛了逛,发现几乎所有的付费模板都用到了视差技术。其中一款比较新的WordPress主题,Magnetto,在我的Retina Macbook Pro上看起来真的是华丽到家了。

只是,这款主题的演示页面在我家的高速网络连接上花了8.5秒才加载完毕。值得吗?

自力更生,不求开发 - 设计师怎样使用Xcode 5制作app原型 »

连续5天的休假业已开始,于是怎样都觉得今天是元旦的样子。天气倒是不坏,可屋里还是会冷的让人站不是坐不是,每到冬天便会一堆牢骚着怀念起北方的暖气,那是怎样的一种幸福呵。

然后呢,之前在微博也念叨过,读到几篇Xcode科普文章,第一反应就是搬来噜。我一直是这样认为的轰:希望能够看掉几篇科普文章就掌握iOS开发基础,这确实不是件很现实的事,但只要你想向目标迈进,俺们就一步一步的向前走。看过文章,觉得有所了解,具体工作还是留给开发,那也合情合理;有了些心得,觉得有兴趣有欲望进一步学习,以求真正掌握开发技能摆脱该死的束缚,则再好不过。我要在这里做的,就是把更多信息分享给更多设计师,让大家看到更多可能性。

今天的这篇,不涉及任何代码编程,纯粹通过大量图片与少许说明来展示实践方式;作者还提供了该案例的完整项目文件,我们可以边参考边学习。我个人建议,可以先读一遍我们之前的“设计师应该了解的iOS应用开发基础知识”一文,对相关的一点点理论知识有所认知,然后再跟着今天这篇文章进行实践。那我就不多念叨了。

这里进入译文。过去几个月里,我每天都早上7点起床,然后持续工作到晚上7点,为的就是既能把我自己的应用Ripple搞出来,同时又能保住我在Carshare.hk的全职工作。这个月里,我整个人都扑在iOS的体验设计上了,我的挑战有两点:确保上面说的两个应用在年内发布,并且在这些项目中同时扮演设计师与前端开发的角色。

15个最新的响应式设计前端框架 »

眼下是较为宁静的周日下午(但这篇没打算周日发),滚石和Led Zeppelin一张一张的放着。别说我老了,10多年前同样是在听这些,特别是在没有多余的精力可以发泄或是没有特别负面的情绪需要抑制的时候。老东西总是最有沉淀感和安全感的,毫无疑问。

正坐在沙发正中间,左右一边一只喵,都盘成个团安静的睡着;从10.1假期把推推从医院接回家开始,每天基本没有晚于6点起床了,加之这一两个月学车的频率也变高了,周末也便是同样的起床时间。搞得这样的下午恍恍惚惚的像是每一个感官都要逐渐睡去的样子了。据说人在将睡未睡的时候,脑波是最利于记忆和创造什么什么的,真真么?倒是记得好多年前以设计博客模板为职业的时候,有几次在睡着之前好像突然看到些特别赞的页面,但接下来要么是没办法让自己醒来,要么是起来试图描画出来的时候又寻它不见了;挺奇妙的。

那么不多说了,和上周的15个响应式前端设计框架同属一个系列,时间较新,用的到的朋友可以看看有无所需。以下文字内容均来自原汇总帖

你会发现,随着响应式Web设计的不断成熟,各类框架也变得越发健壮和可靠。也许是受到了Bootstrap、Foundation和Gumby的影响,如今很多新的框架都开始向一体化多功能的模式进化,它们提供了更多的功能,同时会包含可复用的组件和模块,例如图标、对话框、页码导航、面包屑、导航栏等等。

当然,不是所有的框架都塞入了大量的功能,有些只是简洁的提供了固定布局的基础。接下来是15个最新的响应式框架。

Pages