E丢丢学习App是华夏大地教育可以有限公司旗下的一款产品,专为提升学历者打造,它整合了线上+跟踪的 (E平台)功能,方便工作人员随时随地管理账号、跟进学员;同时还可以随时了解教育行业的新闻资讯、一对一求职招聘、参加考试等!

该产品在2012年3月开始做,2012年9月上线1.0版本,2019.7月更新迭代2.0版本,现在仍然在持续地迭代和优化。在这个产品中,我担任视觉设计师,负责80%的设计工作,2.0版本全部由我独立负责,完整地参与整个项目周期。您也可以在这里观看:On Behance | On Zcool | On Dribbble

项目背景

公司战略和市场分析

青橙在创业初期的主要产品“青橙健身房管理系统”是一款Web端的 SaaS 产品,青橙一直把业务聚焦在B端客户——即健身房上,而随着时间的累积,这个市场将会越来越趋向饱和,而每个健身房包含多名教练、管理者等健身从业者,且随着健身风潮的流行、人们消费能力的升级,健身从业者也在不断增加,因此在这个阶段青橙思考将目标用户从“健身房”这个团体转向“健身从业者”的个体,扩大用户群体,发掘更大的市场,尝试更多能满足健身从业者需求的业务,探索更多的可能性。

另一方面,通过调研我们了解到,市场上针对“健身房从业者”这一范畴用户的产品比较少,大多数产品的用户都是单一角色,如教练或销售,这就导致健身从业人群都是分散的,而青橙正好可以利用已经积累的B端资源,以健身房管理系统为切入点,将健身从业者聚集起来,打造健身从业者的平台,进而实现更多的价值。

产品目标

以健身房管理系统为切入点,打造一个健身从业者的平台,健身从业者的聚集地。

我的角色

在这个产品中,我独立负责1.0版本的所有交互与视觉设计工作,参与产品讨论,整理产品需求,梳理用户核心流程,设计产品的页面布局和信息框架,输出视觉稿,与产品经理、工程师协作让方案落地。

目标用户和需求分析

一个传统健身房里通常包含管理者、教练、前台、会籍顾问等多个角色,各个角色的工作范围和需求有所不同,我们要提供什么样的服务来满足各个健身从业者的需求?通过用户访谈和用户观察,我们整理了不同角色用户日常的工作内容和需求,我们可以把这些需求大致分为两类:健身房办公需求、个人职业发展需求。

设计目标

站在设计的角度,从产品目标和关键词推导设计目标,为了打造健身从业者的聚集地,就必然需要兼顾健身行业中各个角色的需求,当然为了公司盈利,还需要吸引场馆完成付费。

设计关键点

和产品经理一起讨论用户需求后,我更多地站在设计的角度,分析思考其中的设计关键点,在已确认的产品逻辑的基础上,提出自己的想法和建议,寻求更好的解决方案。

解决方案

1)产品结构:健身房办公在用户需求中占很大的比重,是用户较常使用的功能,也是青橙的核心业务,因此把它设计为一级页面;而用户个人职业发展需求,如求职招聘、学习培训等,虽有需求但使用频率并不高,因此把这一类的功能都收到“发现页”里,和“健身房”并列为一级页面,同时发现页还承载了青橙的运营需求。



2)与后台SaaS的对接:由于Web端和App端使用场景和操作习惯的差异,在App里我 大专栏  E丢丢App重设计总结们并不是完全照搬Web端的功能,同时部分功能我们也只在App端提供,如健身房会籍顾问跟进会员的功能,我们就将重点放在App端,这是考虑到会籍跟进会员大多是全天候的,App显然方便很多;而添加商品、编辑等操作,则是在Web端操作更高效,对于这类操作,App端会提示用户扫码到Web端使用。

3)连接用户与健身房:在这个产品中,用户可以不必依赖健身房而存在,使用系统的健身房可以邀请它的员工,反过来,我们也希望通过个人用户来push他所在的健身房使用青橙的系统。用户可以创建自己的健身房,也可以加入同事创建的健身房或者邀请同事加入自己的。

4)快速开始:前面提到健身房中的每个角色日常工作内容都不同,而每个健身房的服务范围也是不尽相同的,那么在无法得知用户身份的情况下,我们应该呈现哪些功能给用户?用户第一次打开产品后又该如何快速找到自己想要的内容?在这里我们做了一些引导,在首次创建健身房时,我们要求用户选择健身房的服务内容,然后根据所选的服务内容,定制化常用功能,这样后续加入的员工都能在健身房首页找到与自己相关的功能,当然,每个用户也可以定制自己的常用功能。

5)免费与付费:我们开放了部分免费功能给基础用户,保证个人用户的使用,对部分的健身房功能做了“Pro”的标志,如添加教练、场馆运营功能等,即:你可以一个人用该系统来管理工作,但如果你要给所在健身房使用,请付费。同时对新场馆给予了首月¥39.9的体验价,吸引用户体验 Pro 版本。

6)减少用户的学习成本:由于目标用户的多元性,在交互上我们遵循 iOS 和 Android 平台的交互规范,在基础交互上减少不必要的创新,减少用户的学习成本,兼顾各个层级的用户。

部分接口展示

完整的项目展示可以在这里观看:On Behance | On Zcool




项目成果

产品上线后,由于免费版的开放,确实为青橙带来了很多用户,“发现”频道的学习培训、求职招聘等模块也成为吸引用户的主要服务,收获了许多用户的好评,但同时也存在着一些不足。如场馆的付费转化率不高,数据显示,虽然注册开通场馆的数量很多,但付费的场馆并不多,分析可能有几个原因:注册的用户大多为个人用户,免费版已经可以满足他们的需求;加入场馆的引导还不够明显,导致同一家健身房的不同用户反复创建,造成重复的脏数据;功能和体验没有达到用户的预期,不愿意付费。但在没有具体数据支撑的情况下,这些只能停留在猜测,在后续的迭代当中,还需要根据数据团队收集的数据来找出原因,进一步优化。

以下数据分别来自青橙官网和 App Store:

项目总结

在参与项目整个周期的过程中,踩过很多坑,但也因此收获了成长,设计远远不是停留在输出的那几张接口,前期对产品的参与、后期与工程师的协作、对方案的反复质疑和推敲,才有了最终呈现的样子。

制定设计目标

在开始设计的时候,问问自己是否已明确了解了项目背景、公司战略和规划、项目目标等,这些是设计的大方向,根据这些大方向制定设计目标、关键点,保证自己正在一条正确的道路上行驶。

在恰当的时候建立设计规范

我认为在产品1.0后去建立完善的设计规范为最佳,包括交互规范、视觉规范,甚至产品规范。太早产品还没有成型,可能会反复修改;太晚产品已经做了那么多,积重难返。在早期的时候,我们虽然有简单的视觉规范,但发展到后来,发现远远不够,这时候再回过头补就会很吃力,成本要高得多。

沟通和信息同步

在工作当中最怕听到上游的人说“我早就说过啊”、下游的人说“我不知道啊”,项目中有任何方向上的变动一定要及时沟通,保证信息同步,保证大家的认知大体一致。

E丢丢App重设计总结的更多相关文章

  1. Android App的设计架构:MVC,MVP,MVVM与架构经验谈

    相关:http://www.cnblogs.com/wytiger/p/5996876.html 和MVC框架模式一样,Model模型处理数据代码不变在Android的App开发中,很多人经常会头疼于 ...

  2. iOS设计 - 一款APP从设计稿到切图过程概述

    这篇文章站在GUI设计师的角度概述了APP从项目启动到切片输出的过程,相当于工作流程的介绍.这里写的不是一种规范,只是一种工作方法,加上技术的更新是非常快的,大家在具体工作中,一定要灵活运用. 这里我 ...

  3. app后端设计--总目录 (转)

    特此说明,我转载的!!! app后端设计(1)--api app后端设计(2)--xmpp的使用 app后端设计(3)--短信,邮件,推送服务 app后端设计(4)-- 通讯的安全性 app后端设计( ...

  4. 【转】App架构设计经验谈:接口的设计

    App架构设计经验谈:接口的设计 App与服务器的通信接口如何设计得好,需要考虑的地方挺多的,在此根据我的一些经验做一些总结分享,旨在抛砖引玉. 安全机制的设计 现在,大部分App的接口都采用REST ...

  5. app后端设计(12)--图片的处理

    app上线后,不断接受用户的反馈,于是,反馈非常差的情况下,都会有app的改版. 一旦app的改版,都会有比较大的UI改动,一改动UI,那么图片的尺寸也就必须要改变. 在app后端设计(1)—api( ...

  6. APP UI设计及切图规范

    APP UI设计及切图规范 1.概述 1.1 编写目的 该文档主要针对移动端开发的视觉设计和开发过程中的工作环节做统一的规划规范,是系统进入UI设计的前置文档.部分内容来自网络收集修编,转载请注明由 ...

  7. 26款能够吸引用户的 iPhone App 界面设计

    在这个移动互联网告诉的时代,众多的移动应用程序涌现出来.谁能抓住用户的注意力,谁就有可能成功.在下面这些移动 App 界面设计中,你可以看到不同创意类型的视觉效果,让你获得灵感. 您可能感兴趣的相关文 ...

  8. APP设计尺寸规范大全,APP界面设计新手教程【官方版】(转)

    正值25学堂一周年之际,同时站长和APP设计同仁们在群里(APP界面设计 UI设计交流群,APP界面设计⑥群 APPUI设计③群58946771 APP设计资源⑤群 386032923欢迎大家加入交流 ...

  9. 最实用的APP界面设计知识,有温度的APP设计(转)

    在逛简书的时候,无意之间看到了这样的一篇非常有意思的app设计博文.顾25学堂的摘录了其中的一些关于移动端APP界面设计的精华.分享给25学堂的app设计师们. 当然,下面的这些app设计知识点是来自 ...

随机推荐

  1. ZJNU 2349 - 抽抽抽

    为4的倍数,列出所有可能情况再判断即可 处理输入的数据对4取模 可得 4444 2244 2222 1111 3333 1133 1223 1344 1124 3324 共十种情况 所以得出答案 #i ...

  2. PowerDesigner 表格导出为excel(转载)

    选中tablesctrl + shift +x 然后运行脚本 '******************************************************************** ...

  3. java日志处理汇总

    org.apache.commons.lang3.time.DateUtils https://blog.csdn.net/yihaoawang/article/details/50638199

  4. 计算机utf-8/gbk/utf-16对照表

    GBK   UTF-16 UTF-8 ==================D2BB  4E00  E4 B8 80  一B6A1  4E01  E4 B8 81  丁C6DF  4E03  E4 B8 ...

  5. 用Chrome网页获取PDF?

    在网页浏览的时候,我常常想保存网页上的内容 这时候有几种选择,要么copy and paste,要么windows自带截图,要么就是借用tencent的截图工具... 但是对于一些用chrome预览的 ...

  6. 用IMX6开发板创建Android模拟器

    基于迅为IMX6开发板 在 AndroidStudio 中,单击“Tools”->“Android”->“AVD Manager”选项.弹出 如下对话框,点击红色方框中的按钮. 弹出如下所 ...

  7. MyBatis从入门到精通(第9章):Spring集成MyBatis(中)

    MyBatis从入门到精通(第9章):Spring集成MyBatis(中) 框架(Framework)是整个或部分系统的可重用设计,表现为一组抽象构件及构件实例间交互的方法.应该将应用自身的设计和具体 ...

  8. 你需要知道的 N 种抓取 dump 的工具

    原总结注册表debug调试dump转储文件windbgprocdump 前言 今天,向大家介绍几种可以抓取应用程序转储文件的工具及基本使用方法.更详细的用法,请参考每个工具对应的帮助文档.如果你还不清 ...

  9. Java远程调用Linux脚本

    参考:http://blog.csdn.net/xiao_jun_0820/article/details/26254813  http://blog.csdn.net/a19881029/artic ...

  10. Linux 安装python3.x步骤

    本文转发自博客园非真的文章,内容略有改动 本文已收录至博客专栏linux安装各种软件及配置环境教程中 linux系统本身默认安装有2.x版本的python,版本x根据不同版本系统有所不同,通过pyth ...