GUI

  • 聊下你不知道的交互设计:交互设计师在项目中是如何工作的

    从事交互设计3年了,经常有朋友和同事问我“到交互到底干嘛的?”答曰:“根据用户的需求及场景,用简单、愉悦的方式完成任务”。但他们似乎还是不太明白。

    2017-05-25
  • 新版MATERIAL DESIGN 官方动效指南(二)

    Material Design的动效设计 是响应式的,自然的。使用缓动曲线和持续时间模式可以创建平滑、一致的动效。

    2017-05-23
  • 新版MATERIAL DESIGN 官方动效指南(三)

    新版Material Design 官方动效指南已经翻译到第三章了!今天这部分,从动效的运动和材料形变入手,让你的动效自然真实,贴近现实状态。再系统的干货都比不上官方的动效指南,西瓜就在这,赶紧来捡。

    2017-05-23
  • 一份全面系统的渐变色自学指南

    踏入新创科技业以来,总是听见许多设计师/工程师朋友们在抱怨设计师与工程师之间的合作有多么的…不融洽(糟糕),要码是设计师常常抱怨工程师没有 美感,不重视设计细节,或是连Guideline都不读完就来跟我讲该怎样设计( → 强烈建议iOS/Android 工程师不管未来是否会接触接口设计都花些时间把iOS的Human Interface Guideline跟Material Design Guideline给看完,这是基本啊!!基本啊!!在线已经有满坑满谷的翻译文章啰,所以别再拿看不懂英文当借口啰);另一方面就是工程师也常常会抱怨 设计师总是把写动画当作小画家,把写程序当成写国字(Framer会红的原因?!)或是总是有着过于天马行空的设计想法。

    2017-05-22
  • 专业的网页风格指南应该如何制作?

    文案规范
    视觉指南

    配色方案,包括每种色彩的具体参数,以及其他可接受的色调
    字体和排版方案,包括每个部分的字体类型、尺寸、字重以及具体用法
    LOGO,包括它的样式、变体、尺寸以及位置的说明
    拼写、关键词的选择、文案的风格(包括按钮、社交媒体等)
    图片使用规范,包括色彩、裁剪规则和视觉表现方面的标准
    SEO信息,比如可选的标签和关键词
    栅格标准(主要用作网页排版和印刷)
    空间与留白方面的说明(设计的松紧度等)
    关键点的说明(团队成员可能会提出的问题或者有待澄清的点)

    在内容表述上不要限制太多,这毕竟是风格指南,重点是视觉上的引导,设计是核心;
    将相关、相联的条目整合到一起做快速指引:一个页面介绍色彩,在另外一个页面做排版的规范等等;
    用图片案例来展示界面应有的外观,而不要单纯用枯燥的文字来做介绍;
    提供可用的具体说明。比如配色方案中提供色彩的RGB或者CMYK的具体值,确保色彩的运用能够一致;
    将一部分的设计案例分解说明,确保每个元素的功能和使用规则都足够明晰;

    2017-05-22
  • 译文 | iOS 10 人机界面指南(二)

    iOS10发布了,苹果遵循了一切从简但又增加了一些提升用户体验的功能,比如向开发者开放了更多接口,设计者又如何跟随iOS的步伐做好产品设计呢?

    2017-05-22
  • 这是我作为交互设计师一年来的总结

    毕业后加入百度成为一名交互设计师已经整整一年了,现在把一些和工作、职场的相关经历和感受写下来。希望能对即将踏进职场的学弟学妹有所帮助。

    2017-05-22
  • 让你的设计拥有高转化率的配色知识简明指南

    互补指的是我们视野中色彩和色彩之间相互补足的关系。选择色轮中处于相对位置的色彩,构成的配色 方案令双眼觉得和谐。最常见的互补配色有两种,三元配色和复合配色,我们将稍后探讨。
    对比则可以将不同的元素区分开来,从而降低视觉疲劳,构建出视觉重心和焦点。元素之间的高对比度让文字更容易被识别,引导用户注意到更关键的信息。背景和背景之上文本的色彩选取就是一个非常常见的对比度的问题,我们会随后聊到。
    色彩对于用户的情绪上的感染也是一个重要因素。

    较小的文本应当确保至少和背景之间有4.5:1的对比度比率
    较大的文本(14pt粗体,18pt常规)应当确保和背景之间的对比度超过3:1

    2017-05-22
  • 译文|界面设计中,关于字体设计的10 个锦囊

    字体作为界面设计的一个元素,对用户的阅读体验起着至关重要的作用。本文是 UI 设计师 Viljami Salminen 分享的用户界面字体设计的基本规则和技巧。一个优秀的设计师懂得:网页上的文字不仅仅作为内容而存在,它还是用来交互的界面。
    – Oliver Reichenstein
    Helvetica 真的弱爆了。它不是为小屏显示而设计的。像「milliliter」这样的单词显示效果就很差。
    – Erik Spiekermann

    2017-05-22
  • 微交互的核心:规则如何定义?

    微交互的核心是规则,规则决定了微交互是什么?怎么用?

    2017-05-21
  • 内部教程|6步透视网易设计规范(附规范PDF下载)

    LOFTER这份精而美的设计规范,页数不多,但每页都是经过三思后得出的总结,推荐一看。

    2017-05-20
  • 用户体验入门:新人自学包之控件学习

    控件(或部件,widget或control)是一种图形用户界面元素,其显示的信息排列可由用户改变,例如视窗或文本框。控件定义的特点是为给定数据的直接操作(direct manipulation)提供单独的互动点。控件是一种基本的可视构件块,包含在应用程序中,控制着该程序处理的所有数据以及关于这些数据的交互操作。
    ——https://zh.wikipedia.org/wiki/控件

    2017-05-20
  • 文本输入框设计的那些潜规则,你知道多少?

    当新用户开始使用一款APP或者入驻某个网站的时候,至少最基本的信息都需要通过文本输入来完成。产品经理、设计师和开发者也都明白,这才是最佳的解决方案。

    2017-05-20
  • 一千个从业者就有一千个交互设计师

    最近在一边工作一边读书的同时,也在思考交互设计是什么以及互联网交互设计师在团队中的定位等一些问题。谈到交互设计仿佛就是“一千个读者就有有一千个哈姆雷特”的感觉,每个人都会说出一套它们自己对于交互设计的理解。

    2017-05-20
  • 图形界面的末路?聊聊未来可能会流行的「对话式交互」

    人类花费数十年才将计算机交互从以命令行为代表的文字界面(TUI)发展到以用户界面为核心的图形界面(GUI),然而这显然不是终点。图形界面之后会出现什么?我们已经隐隐可以窥探到其身影。一起来看看未来流行的交互方式是什么。

    2017-05-20
  • 逐渐兴起的对话式设计,你了解多少?

    对话式交互将逐渐改变人类的生活和习惯,未来的生活是怎样的正是我们所兴奋和期待的:)我以为使机器能与人沟通的关键是发展更好的对话系统。但我这想法并不对。成功的对话需要共通的知识和经验。它需要对四周环境、前后脉络、导致目前情况的历史背景以及当事人众多不同的目标和动机等都要有所领悟。现在我认为这正是当今科技的根本局限,这种局限阻碍了机器全面、拟人化地与人互动。人与人之间要建立共通的了解本来就很难,那我们如何寄望于机器建立这种关系?——唐纳德·A·诺曼

    2017-05-19
  • 交互设计规范分享:页面信息展示、信息交互和通用组件规范

    本规范按web交互属性分三个部分:页面信息规范、信息交互规范、通用组件规范。

    2017-05-19
  • 美国UX达人:用户体验从入门到进阶书籍推荐

    想了解用户体验(UX)并进一步学习?美国的UX达人Witney Hess列出了20本UX爱好者必读的20本书。你可以收藏这个书单。

    2017-05-19
  • 抢先看:微信官方发布的微信应用号(小程序)设计规范

    微信小程序设计的基本原则是微信设计中心针对在微信类上线的小程序页面总结的设计指南及建议。以下设计原则都是基于对用户的尊重的基础上的,旨在微信生态类建立有号、高效、一致的用户体验的同时,最大程度顺应和支持各业务需求设计,实现用户与程序的共赢。

    2017-05-18