当前位置:主页 > Office办公 > 前端设计

前端设计

详细解析UI设计中搜索栏设计的技巧教程
详细解析UI设计中搜索栏设计的技巧教程

在一个内容型的APP中,搜索功能可以说是标配。它是巨大的流量入口,同时又承载着产品运营的能力。碰巧最近在做JOOX搜索页面的优化,借机整理了一下关于搜索设计的几个要点。根据用户的实际使用行为,我们可以把搜索这个操作按照用户行为路径节点分为发现 – 进入 – 使用 – 得到4个部分。发现搜索入口进入搜索界面使用搜索功能得到搜索结果发现入口搜索框的入口一般有几种:一级tab、搜索框、搜索icon、隐藏式搜索框。不论何种样式,遵循的最基本的原则都是两个点:快速发现和容易识别。

详细解析UI设计师如何设计最常见的关闭按钮
详细解析UI设计师如何设计最常见的关闭按钮

读完这篇文章你将会了解到:关闭按钮「x」的设计历史「x」设计的注意事项关闭按钮设计的最佳案例「x」图标在应用中是一个非常常见的交互暗示,可以将烦人的弹窗从内容上进行关闭。无论是模态,对话框还是弹出窗口,都是内容交互中必要的操作元素,我们只需要建立合理的退出方式就好。视觉设计在ux通用设计模式中「退出」(e-x-iting)是非常简单的,你们看到我在 exiting 这个单词中刻意突出了「x」。「x」这个符号的历史可以追溯到20世纪70年代的计算机设计语言,它第一次出现可能是在 Atari TOS(译者注:Atari TOS是雅达利电脑操作系统,在1993年就停产了)菜单中,「x」是退出的命令。它后来被「NeXT」所使用,它为 Windows 的设计带来了灵感,并在1995年随着 Windows 全球大规模的使用而成为关闭的标准符号。讲这段历史,目的是为了说明,没有必要重新造*,使用全世界每个人都能懂的符号更为合适。

设计师解读怎么把扁平化的网页界面做到出彩
设计师解读怎么把扁平化的网页界面做到出彩

扁平化的设计如今随处可见,但是把扁平化做平也是新手常犯的错误,怎么把扁平化的界面做到出彩那,下面我们就一起来学习吧。

详细解析21个Sketch实用高频小技巧教程
详细解析21个Sketch实用高频小技巧教程

整理了日常工作中经常会遇到的小问题和小技巧,都是非常实用的软件使用技巧

29 次浏览
详细解析如何提高登录注册的用户体验设计教程
详细解析如何提高登录注册的用户体验设计教程

一直想写一篇关于登录注册的文章,对于重度懒癌患者的我来说,注册和登录是噩梦,哪怕再想要体验一个app,只要登录注册流程让我觉得累,下意识就会对这个app产生不友好的印象。相信有不少的懒癌用户也是和我一样的心态。之前做公司的项目时,遇到登录注册页面,由于和游戏沾边的项目,登录注册方式非常多,于是对登录注册产生了很多好奇。为什么不同的app登录注册方式不同,有些是直接第三方,有些又设置的很繁琐。后来看了很多app,分析了一些,登录注册的流程,其实关乎产品的商业模式,也就是战略层,登录注册要在兼顾用户体验的同时平衡商业的价值。今天不讨论关于业务模式的问题,单纯从减少注册登录成本,提高用户注册登录兴趣,提高用户体验的方向讨论下,怎样在登录注册中提高用户体验。1.为什么要登录注册我始终认为,设计师想要做好设计,界面仅仅是其一,不能光想界面好看与否,还要好用与否。俗话说:知其然知其所以然,既然要讲登录注册,首先就来了解下为什么需要登录注册吧。登录注册由来以久,好像所有互联网产品都有这一环节,以至于我们已经忽略了为什么有登录注册。先来回顾下,登录注册的作用。看几张截图:以上截图我们可以看出。登录与注册大体上可以分成强制和开放两种类型,而我们思考的切入点就是在这两种类型之间做取舍,产品属性决定登录注册形式,不同的产品类型,对登录注册模块的需求不同。比如,纯工具类产品:输入法、日历、相机、便签、安全工具等,不需要用户登录注册就可以使用产品的绝大部分甚至全部功能,此时就没有必要添加登录注册模块。比如,电商、金融类产品,设计到交易、用户信息等比较私密的信息,就必须单独添加登录注册模块,确保用户的个人信息的真实性以及安全性。再比如,社交社区类产品,可以设置独立的登录注册模块;可以直接借助于第三方平台,这样反而更有利于产品的传播扩散;也可以两者皆有。2.登录注册对于产品体验的影响没有一个用户愿意在登录/注册上花费太多时间,因此易用便捷是用户的基本需求。快速简洁的注册登录体验,可以有效增加转化率。在此基础上,需要结合内部需求,规划要给用户提供几种登录/注册方式,其中对登录失败的处理机制也是需要关注的点,例如找回密码、手机收不到验证等,不过文章暂不讨论。

25 次浏览
UI设计师需要学习的保存功能设计总结
UI设计师需要学习的保存功能设计总结

保存是后台产品中很通用的操作,它司空见惯到我们误认为保存一般不会有体验上的问题。但笔者在工作中观察发现:即使再通用,用户也可能会在保存功能上遇到疑惑,甚至忽略了它的存在。这是为什么呢?保存功能应该如何设计呢?我想分享一下我的一些经验。围绕保存,我觉得从机制上来分解,可以从手动保存、自动保存、保存兜底三个维度递进思考,最终找到合理的保存设计方式。一、手动保存手动保存,即依赖用户做额外操作才可以达成的保存行为。此类保存,我们往往依赖保存按钮。我会从保存按钮的位置个数,对齐方式和视觉样式来讨论如何设计它。1. 保存按钮的位置保存按钮一般位于内容的下方,因为用户一般从页面上到下确认完内容后再进行保存。这也符合用户浏览路径方便点击。 如果配置内容较短,保存按钮一般紧跟内容,用户更容易发现。但如果表单内容过长且超过一屏,保存按钮还紧跟内容的话它就不会在第一屏展现。此时用户必须把页面滑动到底部才可发现按钮。首次填写表单的话还好,但日后只对某几项内容修改的时候,用户就很容易忽略按钮。而且即使用户意识到保存按钮在底部,操作效率也是比较低的。

提升表单体验的7招表单设计设计师方法教程
提升表单体验的7招表单设计设计师方法教程

最近在做认证的优化,期间涉及到一系列的表单设计。在制作过程中,发现我对于提示语、按钮的位置、是否放步骤条等等都无法做出快速的判断,这说明我对这部分的概念是比较模糊的,所以就想针对表单的体验设计做一个学习和总结,加深自己对表单设计的理解。一、什么是表单表单在网页或 app 中主要负责数据采集的功能。也就是说,大部分起到了数据采集功能的模块,我们都可以称其为表单。表单本身只是一个数据采集的工具,本身不具有属性,它可以被灵活运用于多种功能模块中,例如用于登录注册模块的信息采集,评论的编辑页,朋友圈的发布页等。△ 淘宝从视觉表现上分类,一个表单有3个基本组成部分:标签:告诉用户相应的输入元素是什么。输入域 :一般包含文本框、单选框、复选框、下拉选择、文件上传、开关、步进器、步骤条等。表单按钮:包括提交按钮、复位按钮和一般按钮。此外还可以有:

39 次浏览