电商工作后台首页的商业价值重构与产品化设计
电商网站一分为前台导购及后台管理两方面，通常由买家及卖家两种角色组成。大部分的工作是在后台完成，涉及到各类管理系统，保障日常工作顺利运行。后台产品设计因其逻辑复杂、业务繁多、专业性强具有较大挑战性，在很多情况下设计师的发挥受到较大限制。尤其是B类后台产品的设计需要对公司业务拥有更全方位的认识，加大了其设计难度。做为设计师如何重新定义后台商业价值？如何进行产品化设计思考？下面以买卖家工作台首页设计为例，来介绍下整体设计思路。
买卖家工作台是什么？
买卖家工作台是基于1688大数据为企业提供生意决策、日常工作管理的中小企业操作管理后台。
设计之前：思考在最前方，与业务一起确定产品方向
转变思维方式：由被动接受到主动提案做为体验设计师需要对整个产品负责，在产品改造前期提前与PD对焦思路，全链路思考主动提出对产品的整体想法，而非到某项交互功能再介入，或者是某个页面视觉表现再进行。对焦的过程中也发现项目的诸多难点：涉及B2B所有业务，风险大，影响范围广。为保证产品方向的准确性需要与业务方进行多次沟通讨论及产品汇报。 产品方向确定基本流程： 思路对焦——方案讨论——方案设计——产品汇报——确定方向。
商业价值重构三步走：一、了解定位，转换视角1、了解产品整体定位： 在进行商业价值重构前充分了解产品定位。以工作台为例，今年1688针对B2B市场提出了人、货、场的战略。人：帮助引流，货：提升品质，场：提升能力，做为1688用户的核心工作场景-工作台成为重要场景之一，需要结合新战略进行全新升级，加强人在后台场中的匹配效率。
2、从业务视角转变为用户视角：在设计对焦过程发现，现有版本融入了较多内部运营工作逻辑，体现各个部门的利益及立场。比如网站多了一块新业务需要向用户推广，就会在后台中增加一个介绍版块让用户区体验，缺少用户去体验功能的场景及动机。偏向一个流量分发为中心的核心阵地。业务视角展现在用户层面比较难理解。做为B类用户更多的是从做生意的角度来使用后台，需要做一层转化才能到达认知，一定程度上影响了用户的使用效率。因此需要翻译成用户能理解的产品表达。
二、统一战线，建立目标与产品、运营统一战线，建立目标。将一个流量分发为中心的核心阵地打造成以用户服务为中心的产品。
三、明确关系，构建大图明确商业价值的构成者，做为平台一共有三方：平台方、买方及卖方。完整的商业价值构建需要联动三方一起共进。工作台以阿里大数据为中心，网站平台小二通过行业市场来服务我们的买家，同时通过商家培育体系来服务我们的卖家帮助商家成长，商家通过自我成长提升自身运营能力来服务好买家，构建出稳固的铁三角服务生态大图。通过建立价值生态场景，帮助业务打通上下游市场，让小二更好的服务买家，促使商家自运营。
明确商业价值后，进行产品化设计一、挖掘用户使痛点1、定性：采用敏捷式共建用研，在有限制时间内，获得丰富有效信息
首先谈下用研方式，传统的用研从制定访谈计划、问卷设计、用户邀约、执行调研、分析数据到撰写报告，整个过程基本由用研同学独立完成，在项目时间比较紧张的情况下会受到限制。因此我们采用了敏捷式共建用研，在临时机动的情况下获取用户痛点的方式，有几个小tips可供参考：
A、项目组共建用研：打破流程限制，在与用研同学确定好调研提纲后，发动项目组的成员运营、开发、测试等共同参与调研；B、灵活邀约客户：借助园区商家活动、会议等在中间抽取时间机动调研，在中午休息时间就访谈了近15位客户；C、访谈结果及时产出：后项目组成员当即进行调研总结及改进建议，大大提高了访谈的输出效率，也提高了项目成员的对于用户的整体感知。用户调研不在于形式，在于是否通过有效方式得到想要的信息.优势：用户量大，意愿大，调研成本低 风险：目标用户不稳定、用户经营状态感知偏弱。定性调研发现：
买家：主要工作行为是采购管理和销售管理，小买家不会进行进销存管理，进销存管理工具不能同步1688信息，查看物流不方便、不能看到销售数据情况，交易过的公司公司使用量低等情况。
卖家：主要使用群体为公司操作员基本每天都会进入后台操作，主要操作行为查看店铺数据、进行交易订单管理、商品管理、店铺管理、营销活动管理。核心曝光、访客及转化情况。调研中发现用户在后台操作的目标感模糊，例如用户反馈：刚开了店铺，后面要怎么弄，完全没方向！别人都是怎么做的，没有引导性；购买诚信通仅为了标识，无线上行为不知道要怎么做？没有把线下用户拉到线上等问题。
2、定量：通过数据分析发现用户使用都比较集中，部分模块使用率较低，有效信息少；长尾效应明显，交易链路为买卖家高频行为，抓手欠缺。
二、确定设计目标及策略基于用户的行为差异及诉求差异，制定不同的设计目标及策略。工作台结合买卖家做了版本区分，分为买家版及卖家版
买家版设计目标：让买家拥有精细化的采销服务，提高进货效率
设计策略：
1、精简化：信息架构场景化，内容模块调整；2、数据化、个性化：通过用户行为数据、关系数据提供个性化服务，接入第三方服务满足买家下游需求；3、互动性：平台与买家、买家与卖家间的互动，进行服务触达，关系显性化，从而促进商业价值最大化。卖家版设计目标：帮助商家更好的自我成长，提高自运营能力
设计策略：
1、精简化：信息架构场景化，快捷入口调整；2、数据化自运营：分类管理，结合用研中了解的用户核心场景：管交易、管店、管货、管客及管活动进行模块分类3、卖家生命周期管理：建立用户成长激励体系，通过用户进阶分层明确成长目标，促使用户成长。 策略图：三、交互阶段信息架构细化设计，建立模块产品化交互设计Guideline信息架构核心抓手有三：
1、 导航分类场景化：以卖家版为例，在导航区域核心体现卖家四大工作场景：管交易、管店、管货、管客及管活动。
2、 内容场景数据导向化：中间内容区域以总体成长情况和场景数据情况进行导向性设计，提供数据分析及行动操作。明确用户核心内容及操作。
3、 模块设计产品化：建立模块交互设计Guideline 为保障后续新增模块价值传递的统一性，建立模块产品化交互设计Guideline。 对所有模块进行了功能分类，主要分为两种： 1、任务服务模块： 任务服务模块设计需要明确：模块是什么？（业务视角转为用户视角）目标现状，怎么做及可获得什么服务。 2、消息模块：传递服务是什么？怎么做？
举例：客户管理模块
1、模块是什么？：店铺客户管理2、目标现状：店铺的访客、潜在客户、成交客户及流失客户情况3、怎么做？：进行客户召回4、可获得什么？：客户数量增加，客户管理类工具交互设计微创新：功能地图设计
工作台中的功能入口众多，为方便用户查找及使用，对功能地图进行优化。统一工作场景分类认知与导航分类保持一致，减少界面中分类层级，用户点击功能地图后可进行自定菜单设置，将自己常用的入口钉到左侧菜单中。
优化前：
优化后：
四、视觉设计无边界，寻找核心发力点通常一个产品进入视觉设计就开始YY各种品牌元素及表现感知方面的设计，而作为后台产品因其偏重操作，在视觉设计前，需要宏观的进行再思考，用户通过感知可以带来什么价值？在工作台视觉设计前进行了进行感知升级思考，建立感知升级闭环贯穿在整个视觉设计环节，闭环全图：
视觉设计核心发力点提取： 在对整体闭环有一定认知后，进行感知定位通过与项目组成员共建提取工作台感知云标签，提取感知关键词：简单、清晰及高效。在视觉层面主要通过风格定义、特色模块设计及情感化设计来发力。
1、风格定义：对B2B供应链管理类后台从颜色、图标、控件、模块等方面进行视觉层面竞品分析，同时了解时下主流产品设计趋势如微软、facebook，IOS11最新视觉风格。发现以下特点：
形：去装饰，以内容为中心，去掉了多余的装饰元素色：少颜色，通过大小对比来突出主体，减少颜色质：扁平化设计，微渐变构：减线条，弱化线条分割，通过留白来区分空间，轻划分：巧用投影做区块划分 综合以上分析进行风格定义设计买家版：
卖家版：
风格细节：
导航优化：为保障用户认知的统一性，沿用了老版本中买家橙色，卖家蓝色的颜色特征。导航设计中缩减了颜色在导航中的比重，通过版本字体来区分。简化老版本中当前状态的框选样式，通过TAB短线来表示当前状态。
内容再设计：老版本中代办模块信息内容密集识别困难，操作性较低，通过信息名片卡片式设计待办归类整理，突出核心内容
化繁为简：现有页面中模块很多用线条来区分，信息量比较多的情况下，页面相对复杂，因此弱化线条分割，通过留白来区分空间
图标设计：对后台产品中的图标进行了功能分类：说明性图标、权益性图标。后台图标设计需要控制其表现力度，因此在设计上通过局部细节点缀来表现。权益类图标与前台门洞类做区分，减少颜色运用，结合买卖身份做橙、蓝底色区分，使用简易面状的形式来凸显特征。
2、特色模块设计，以成长模块为例
模块设计背景：根据商家在平台的七项能力，统一分层体系，促进商家自运营，从而为买家提供优质货源和采购体验
设计方向：为帮助商家在平台更好的成长，全链路思考用户成长环节。在工作台中的透传中，使用商务跑的方式来激励用户，并给予成长引导基于模块设计Guideline明确：
1、模块是什么？：我的成长2、目标现状：成长能力得分3、怎么做？：成长任务4、可获得什么？：成长权益 对模块进行划分：成长感知定位，主要通过两方面，提取物像特征，提取表现形式
通过商务人物奔跑的形式来表现成长进度，为便于用户进行成长任务连贯操作设计全链路成长插件，提高成长效率。
3、情感化设计：
身份卡片设计：
使用2.5D元素来增加用户新手操作的实体感受：
五、后台动效，让工作台体验更流畅在项目过程中非常感谢成龙、梅郁在设计思路及方法上的引导，感谢团队中顾佳、苏林给力的设计支持。
产品化设计任重道远，是一个不断优化迭代的过程，还需要联合各方力量一起合力，共同改进。在新形势下，设计师已不在是接需求的资源方，而是产品共同的缔造者。需要利用一切能够改善产品的方式，用我们的全部智慧和能力，为我们的用户服务。
U一点
作者：金莉
绛旓細鍟嗕笟浠峰奸噸鏋勪笁姝ヨ蛋: 涓銆佷簡瑙ｅ畾浣,杞崲瑙嗚 1銆佷簡瑙ｄ骇鍝佹暣浣撳畾浣: 鍦ㄨ繘琛屽晢涓氫环鍊奸噸鏋勫墠鍏呭垎浜嗚В浜у搧瀹氫綅銆備互宸ヤ綔鍙颁负渚,浠婂勾1688閽堝B2B甯傚満鎻愬嚭浜嗕汉銆佽揣銆佸満鐨勬垬鐣ャ備汉:甯姪寮曟祦,璐:鎻愬崌鍝佽川,鍦:鎻愬崌鑳藉姏,鍋氫负1688鐢ㄦ埛鐨勬牳蹇冨伐浣滃満鏅-宸ヤ綔鍙版垚涓洪噸瑕佸満鏅箣涓,闇瑕佺粨鍚堟柊鎴樼暐杩涜鍏ㄦ柊鍗囩骇,鍔犲己浜哄湪鍚庡彴鍦轰腑鐨勫尮閰...
绛旓細淇℃伅銆佽祫閲戙佸晢鏈恒侀厤閫佺瓑鏄數瀛愬晢鍔℃垚鍔熺殑鍏抽敭瑕佺礌锛岀ぞ浼氬垎宸ヤ笌鏁堢巼鎻愬崌灏や负閲嶈銆2.3 浼佷笟閲嶆瀯鍐呭 浼佷笟閲嶆瀯娑夊強鎴樼暐璋冩暣銆佹祦绋嬩紭鍖栵紝浠ラ傚簲鐢靛瓙鍟嗗姟鐨勫彉闈╅渶姹傘傜涓夐儴鍒嗭細妗堜緥鍒嗘瀽 绗笁绔狅紝娣卞叆鍒嗘瀽浜嗗叿鏈夎涓氳儗鏅殑鍨傜洿鐢靛瓙鍟嗗姟閲嶆瀯妗堜緥锛屽IBM銆佸悍鏌忋佹儬鏅拰閫氱敤鐢垫皵銆傜鍥涚珷鑷崇鍏珷锛屽垎鍒帰璁ㄤ簡鍨傜洿...
绛旓細绠瑷涔,浼佷笟鐜版湁鍟嗕笟妯″紡鐨勯噸鏋勫拰浼樺寲,涓昏鏈変簲绉嶆柟寮:(1)閲嶆柊瀹氫綅闇姹;(2)閲嶇粍浠峰肩幆鑺;(3)閲嶆瀯浜ゆ槗鏂瑰紡;(4)閲嶅缓鐩堝埄妯″紡;(5)閲嶅鍟嗕笟浣嶅娍銆傚叿浣撳鍥6-1鎵绀恒 浠ヤ笂杩欎簺閲嶆瀯鏂瑰紡,鍦ㄥ疄璺典腑,瑕佹牴鎹紒涓氱幇鏈夊晢涓氭ā寮忓叿浣撳瓨鍦ㄧ殑闂鏈夐拡瀵规у湴杩愮敤,鍙互鏄崟涓鏂瑰紡,涔熷彲浠ユ槸澶氱鏂瑰紡骞惰,璀閲嶆柊瀹氫綅闇姹傜殑鍚屾椂,...
绛旓細鍚庡彴绯荤粺瀵逛簬涓嶅悓鐨勭敤鎴疯岃█锛屾槸涓嶄竴鏍风殑銆傚浜庣敤鎴锋潵璇达細鍟嗗鍜屽钩鍙伴兘灞炰簬鍚庡彴绯荤粺锛屽浜庡晢瀹舵潵璇达細搴楅摵绠＄悊灏卞睘浜庡悗鍙扮郴缁燂紝瀵逛簬骞冲彴鏉ヨ锛屽唴閮ㄧ鐞嗗伐鍏峰拰鐢靛晢涓氬姟鍚庡彴灞炰簬鍚庡彴绯荤粺銆傜數鍟嗕笟鍔″悗鍙扮郴缁熺殑浣滅敤 浼樼鐨勪骇鍝佺粡鐞嗗彲浠ラ氳繃瀵逛笟鍔＄殑浜嗚В锛岄夋嫨鍚堥傜殑鍚庡彴浜у搧鏋舵瀯锛屼粠鏁翠綋鐨勮搴﹀幓鑰冭檻鍚庡彴鍔熻兘鐨勫悎鐞嗘...
绛旓細鍒╃泭閲嶅垎閰嶄笌鐢靛晢瑙掕壊杞瀷鏄疧2O閲嶆瀯鐨勫叧閿偣 2014骞达紝闃块噷宸村反O2O鎴樼暐涓紝鍏舵牳蹇冨湪浜庢帹鍔鍟嗕笟鐢熸佺殑鐮村眬涓庨噸鏋勩傞鍏堬紝閫氳繃鎴樼暐鍥涙璧帮紝寮鸿皟鐢靛瓙鍟嗗姟鐨缁堝眬鐩爣鈥斺旀敼鍙樹笘鐣岋紝甯冨眬鍏抽敭棰嗗煙锛屽鏀惰喘楂樺痉鍦板浘浠ュ己鍖朞2O鍩虹銆傚湪娑堣垂鑰呰鐭ュ眰闈紝瀹氫綅涓哄晢鍔＄數瀛愬寲骞冲彴锛屽C2B妯″紡鐨勬湭鏉ヨ秼鍔裤傝嚜2013骞村弻鍗佷竴鍚庯紝...
绛旓細鎵舵寔璁″垝鍏ㄩ潰寮鑺憋紝鐧惧害鐢靛晢涓嶄粎鍏虫敞绾夸笂锛屾洿閲嶈绾夸笅浜掑姩鍜岃揪浜浠峰鐨勬寲鎺樸傚惎鑸鍒掋佽仛鍏夎鍒掑拰鐧惧煄涓囧搧绛夌瓥鐣ワ紝鏃ㄥ湪鎻愬崌鍟嗗涓庣敤鎴风殑绮樻э紝寮哄寲褰卞搷鍔涳紝鏋勫缓鏇翠负绋冲浐鐨勫晢涓鐢熸併備剑閲戜笌婵鍔憋紝鍒涙柊鎴樼暐涓轰簡鎵舵寔鏂板晢瀹讹紝鐧惧害鐢靛晢鎺ㄥ嚭浜嗕竴绯诲垪浼樻儬鏀跨瓥锛屽寘鎷1%璧风殑浣庤垂鐜囦剑閲戙佸崈浜挎祦閲忔縺鍔便佹椿鍔ㄨˉ璐村拰涓撲笟鍩硅...
绛旓細鍒嗘瀽鐢靛瓙鍟嗗姟閲嶆瀯浜т笟閾惧鍩庡競鍙戝睍鐨勫奖鍝 鐢靛瓙鍟嗗姟鐨蹇熷彂灞,灏嗕笉鍙伩寮鐨勫紩鍙戜骇涓氶摼鏉鐨勯噸鏋,灏嗕細杞彉鍘熸湁浜т笟閾句腑鍙備笌鑰呯殑瀛樻椿鐘舵,鑰屼骇涓氶摼鐨勮浆鍙,涔熷皢杞彉鍦板尯鍜屽煄甯傜殑鍙戝睍鑺傚,褰卞搷涓嶅悓鍦板尯鍜屽煄甯傚湪鐜伴樁娈电粡娴庡彂灞曚腑鐨勫湴浣嶃 涓銆佸師鏈変骇涓氶摼 鍦ㄥ伐涓氬寲鐨勬椂浠,浜у搧缁忕敱鐢熶骇鍟嗗埌杈炬秷璐硅呮墜涓渶瑕佺粡杩囪澶氱幆鑺,...
绛旓細鐢靛晢鐨鏄ュぉ涓嶄粎瀵瑰晢瀹惰岃█鏄満閬囷紝鏇存槸鍟嗕笟鍩虹璁炬柦鐨勯噸鏋銆傞殢鐫浜掕仈缃戞繁鍏ヤ紒涓浠峰閾撅紝鎵鏈夊晢鍔￠兘灏嗛粯璁や簰鑱旂綉涓哄熀纭璁炬柦銆傚敖绠℃寫鎴橀噸閲嶏紝浣嗙數鍟嗙敓鎬佹墠鍒氬垰璧锋锛屾湭鏉ュ厖婊℃棤闄愬彲鑳斤紝鍏抽敭鍦ㄤ簬鐞嗚В瀹㈡埛闇姹傦紝鎻愪緵鐙壒浠峰笺傚彾鏈嬭繕鎸囧嚭锛屼紒涓氬湪闈复绔炰簤鏃讹紝闇瑕佷粠甯傚満鐜鍜屾秷璐硅呰涓哄彉鍖栦腑鎵惧埌閫傚悎鑷繁鐨勫彂灞曠瓥鐣...
绛旓細10. 鍟嗕笟妯″紡浜掕仈缃戝寲閫氳繃浜掕仈缃戞ā寮忓垱鏂颁笟鍔★紝鏁村悎璧勬簮锛閲嶆瀯鍟嗕笟浠峰閾撅紝杩涜鍐呴儴鍜岃法鐣岄潻鏂般11. 鐩墠浼佷笟杞瀷鐒︾偣澶氭斁鍦鐢靛晢涓婏紝鍥犱负澶氭暟浼佷笟闈复閿鍞箯鍔涢棶棰橈紝鐢靛晢鎴愪负澧炲姞閿鍞笭閬撱佹墿澶ч攢閲忕殑涓绉嶆柟寮忋12. 鐒惰岋紝鐢靛晢鍙槸浜掕仈缃戣浆鍨嬬殑涓涓瓙妯″潡锛岄攢鍞棶棰樻秹鍙婁骇鍝佺爺鍙戙佺敓浜с佹垬鐣ョ瓑澶氫釜灞傞潰銆13. ...
绛旓細SNS鐨勭ぞ浼氬睘鎬у皢鍑告樉鐢靛瓙鍟嗗姟鐨钀ラ攢浠峰銆 鍐嶆,鐢靛瓙鍟嗗姟浼佷笟铻嶈祫娴疆涓娉㈤艰繎涓娉,鏂板叴鐢靛瓙鍟嗗姟浼佷笟鍦ㄨ瀺璧勭殑杩囩▼涓洿闇瑕佸紩鍏ユ柊鐨勬蹇靛紩璧疯祫鏈競鍦虹殑鍏虫敞銆 浜屻佺Щ鍔ㄧ數瀛愬晢鍔 2010骞翠腑鍥界Щ鍔ㄧ綉闄呯綉璺姇璧勫競鍦洪潪甯告椿璺,鎶曡祫鏈烘瀯闈炲父鐪嬪ソ绉诲姩缃戦檯缃戣矾鍙戝睍鏈洪亣銆傜Щ鍔ㄧ綉闄呯綉璺鍦ㄥ甫鏉鍟嗕笟妯″紡鍙橀潻鍜屼骇涓氶摼鐨勫埄鐩閲嶆瀯,灏嗙嚎涓婅櫄鎷...
