作者：夺冠小妹 2019-02-27 10:08:11
第一届夺冠魔方超级页面制作大赛的圆满收官，一不小心就引起轩然大波。
当一款小程序被用户点开，从视觉体验到抓住用户的眼球，如何才能得到用户的认同感和信任感？
在我们公布获奖作品出来后，许多代理商反馈，是否可以邀请获奖代理商分享制作小程序的经验……考虑到活动的目的是为了挖掘更多精美的小程序案例，和促进夺冠魔方各位代理商相互学习。因此，我们邀请了获奖代理商为大家准备一系列文章供参考，希望能够为你带来启发。
~鼓掌~
~撒花~
第七期：「美业优品」
小程序介绍：美业优品从事美甲、美睫、美容、美发服务类行业，作者分享了从业务洽谈、到小程序制作的经历，「美业优品」获得“超级高手”的魅力是因为…
使用模块：微商城、微拼团、内容管理+、活动报名、万能表单、超级页面。
首先，很荣幸获得第一届夺冠魔方超级页面制作大赛的超级高手，也让我见到了许多优秀的作品。我想了许久，我这篇分享文章到底分享什么才有价值？我决定将我们从业务洽谈到小程序功能策划及制作流程分享给大家。
在分享之前，我不得不为夺冠点个赞！夺冠的超级页面功能的确很强大，强大到你无法想象。
同时也感谢夺冠技术部门的鼎力配合支持，才让美业优品这个小程序超预期的完成。也让客户对我们“刮目相看”。
美业优品这个客户，是我们主动上门洽谈的。客户是在我们成都当地经营美业产品批发及美业职业技能培训，（PS美业：指从事美甲、美睫、美容、美发服务类行业）这个客户也是我亲自洽谈沟通的。
一到客户公司，就发现有许多可以利用我们小程序实现智能化，聊上几句，我就说：“刘总！我至少可以让你一年省下近20万，而且让你的客户更愿意选择在你家进货，同时也让你的每个门店从销售到收银再到销售员工业绩提成实现全智能化，提升整个工作效率及业绩增长”。我心想此时客户肯定再想又来了一个说得好听的吹牛大王~客户还是被我的话给吸引住了，还是想看看我葫芦里到底卖的什么药...
我为什么说能为客户一年省下近20万，我看他们的批发门店还是在用很传统的经营方式，销售陪客户选货，介绍产品，客户选好走到收银位置，收银员一个一个看商品编码开单，还要多数两遍免得出错，开完单客户对单付钱（基本都是移动支付），我一下就想到为什么不能客户进店，销售接待客户沟通需求，然后引导客户扫码（利用对应销售员分销小程序码）进入小程序需要什么添加购物车在线购买，然后放个云打印机打单，配货。
哈哈，这样是不是就从销售——收银——销售员业绩提成计算一下就解决了！完美
一个门店就是两个打单收银的，有3个门店啊。一个收银工资一个月在4500，那不是3个门店X2位收银X4500元X12个月=32.4万。妈呀~我还估计少了...这个账给客户一算，从客户眼神里感觉我好像说的对！
所以兄弟们！跟这些实干派的老板们谈，要找他们算账啊~不算不知道，一算吓一跳！这样机会还是挺大的~（不知道这算不算经验哈）
聊到这的时候，我心想客户是不是觉得我是卖收银软件的啊！不妥，我又跟客户说，我觉得你实体做的很好，不能不做线上平台化运营建设了！此时客户深深地被我的容貌吸引了，不对，是被我的言语吸引了！
我说：“刘总，刚刚节省开支又能提升工作效率的只是最基本的！你想想，你的客户有的都那么远，那不是每次补货都要跑一趟，多不好啊，即使不跑，跟销售微信对接进货购物体验感也不好啊！我们可以打造一个客户在小程序里又可以在线视频学习行业最新的一些技能或者开店经营指南的东西，让客户没事就可以进入我们小程序来学习学习，这样我们的转化率是不是就更高些~我想给你打造一个有价值的行业内容输出、在线商城购物体验感强、会员留存沉淀为一体的全营销平台”…
又谈了些小程序运营方式，这下客户恍然大悟了！我也成功为客户道明我的目的了~谈了个好价，成交！
反复研究了最后决定的功能搭配：微商城、微拼团、内容管理+、活动报名、万能表单。没毛病！开撸~
进入超级页面，发现页面管理里最多只能支持8个页面，我一下觉得不够啊~我在想要不页面妥协就控制在8个，想了好久觉得还是不妥！然后，跟总部说了下，一会儿就从以前的8个页面变成了20个页面了，再次给夺冠点个赞！真棒~
首先，把页面规划好，小程序用户端菜单最多展示5个，做好暂时出来的5个页面的菜单图标，每个图片建议出两个，一个未选中状态和一个选中状态的，这样才好看嘛，也符合UI规范，尺寸大小嘛，都有标识80X80像素。
注意：分享标题一定要改，像美业优品，首页的分享标题就用的美业优品sologon：做美业，就上美业优品~（美业优品小程序LOGO及小程序名称和sologon是我们公司一并策划的）至于分享图片嘛，就看自己了哈，反正我是一个追求极致的人，就做了！这样客户也会觉得超专业，哈哈~
页面里面内容设计呢，我们主要用PS和AI软件，至于这个设计嘛，还是要有些规范才好看，文字字体，我建议用免商用版权的思源黑体，字号大小要规范，标题字号一样大，内容字号一样大，颜色统一才好看~其次就是页面颜色配色了，不能太花哨，符合大众审美，免得整的太LOW~
当在PS里完成了设计，就用PS的切片工具进行切片，切片导出为Web所用格式，这样图片精度够高，图片数据还小，这样免得用户端网络加载过慢~用户体验感不好！
在使用超级页面制作时我每个页面里用的自定义组件的轮播组件和热区组件，轮播组件主要用于页面设计里的轮播 banner，咱们的组件属性里都可以对组件一些细节做调整。
这里给大家说下，下间距开与不开取决于页面的整体设计，组件高度，就是里面放置的图片高度的像素是多少，比如我这张图是：750*540 像素，那我就把组件高度设置在 540。这样轮播里图片的展示才是完整的~
接下来就是给大家聊聊咱们超级好用的热区组件了！这家伙的功能的确是实用，猛啊~我整个美业优品的页面基本就靠这个，热区组件，可以自动识别图片的像素大小，设置热点就更猛了，一张图片里可以设置很多的链接，直到你画不下热点链接小框框~当然一个图里的链接入口不要太密了，不好！
用了热区组件，再也不担心后期运营需要改变页面氛围，重新打包代码提交审核了，只要热区组件在，你想怎么改就怎么改，改好后点个仅保存，就 OK！
这里给大家讲下，一张比较长的图，不要只用一个热区组件，把长图切片，分开多个热区组件制作，这样做的目的就是避免用户打开小程序一张长图数据大了，加载过慢，花屏！
页面不在于多，而应该结合小程序的功能和用户使用起来是否页面的设计引导合理，但是好看的小程序还是会增加用户的停留的~
总结：感谢大家的阅读，希望「夺冠魔方超级页面制作大赛获奖作品」征集文能为你带来启发！
