赞助商
立即赞助

接到了一个小程序的设计私单,和App设计一样吗?

UI设计3年前 (2021)更新 流光
2.4K 0 0

微信的最一次更,小程序入口变浅了很多。最使的小程序,被放置在微信打开后初始页面的拉菜单中,而且给的拉栏空间非充足。为了培养户使小程序的习惯和更多人了解小程序,微信开发团队还推了「跳一跳」小程序游戏。

小编的朋小王最近就接一笔小程序私单,因为之前没接触小程序设计,他是按照做App思路做的,所以程他基就样……

接到了一个小程序的设计私单,和App设计一样吗?

接到了一个小程序的设计私单,和App设计一样吗?

随着小程序的普及,设计师们接到了小程序设计的私单,为了避免和小王一样的惨痛经历。小编今天就通过分析几款应,跟大聊一聊App和微信小程序设的异同。

商城类

蘑菇街App小程序的界面对比非常典型。

接到了一个小程序的设计私单,和App设计一样吗?

首先,看到小程序的第一印象就简洁、扁平。App栏的banner小程序中消失了,换了主题色背景加「领包」字样。(包领完后栏置移动缩小,背景不变)实icon到小程序中都变了简约的线性图标配以加后的字体。第三栏虽使用了实图片,但整体增加灰度,页面的统一性加强。其次,下滑后会发,小程序比App少了水平滚动列表,直接一级页面显示商品信息,使用用户的一句话短替直播、专题推荐。

接到了一个小程序的设计私单,和App设计一样吗?

这样整体看去界面显得轻,符合小程序的设需求。得注意的小程序页面特加了一句,「本商城腾讯投资企业,全场包邮,官方保证」。这真的给产品理点赞了,因用App的人多忠实用户,但微信端用户很可能通过朋友圈、群聊第一次使用。愿意使用小程序的用户,一般讲对微信信任度较高,这句话无疑给新用户打了一剂强针,顺便抱了腾讯爸爸的腿。

同样是依赖社区和UGC容生产起的小红书,小红书的小程序端可说是非符合设计师审美了——极简。

接到了一个小程序的设计私单,和App设计一样吗?

tabbar只有两个容,「首页—我的」,一级页面没有任何引导和功分区,只看商和搜商。得说,在众多使横线划分栏的小程序中,使卡片式竖列的小红书非吸引人。

接到了一个小程序的设计私单,和App设计一样吗?

二级页面(商详情页)较像淘宝,有户推荐和商详情,但都采取了「一拉到」方式。点开于某个商的户推荐后,才会现App「发现」功的容。从逻辑上讲,小红书是把App的并列功换成了串联功/触发功,才做到了页面的极简。

不小红书的「极简风」一定程度的暴露在用户吸引方面的自信,不道际引流效果,我们且看小红书小程序界面的更新动向。

资讯类

资类的小程序一定程度分担微信众号的部分功能,在小程序上文章、讨论,要比众号来的灵活方便,也成为的一种展趋势。

第一个要说的案例就是《好奇心日报》程序,它和App一,顶部Navber为新闻和讨论部,部讨论被植入新闻栏目中,没有底部导航栏。但是App内的水滚动列表和Q字悬浮按钮消失了。

接到了一个小程序的设计私单,和App设计一样吗?

接到了一个小程序的设计私单,和App设计一样吗?

款App中的悬浮按钮际上承担应用的大量功能。按钮的消失意味着用户无法在小程序中登录、使用功能,也不能在二级页面中进行评论(以匿名点赞)。正小程序名字的变更,它更像一电子「志」。奇心报在功能上做减法。

取消社交功能是否适呢?再对比一下钛媒体程序。

接到了一个小程序的设计私单,和App设计一样吗?

App和程序选择了不同的主题色,但都是品牌颜色,湖蓝起来更为活泼,但个人觉没有黑色凸显品味。(如下图)公可能考虑了程序和App目标受众不同,程序端用户更年轻。

接到了一个小程序的设计私单,和App设计一样吗?

底部导航栏除「发现—活动」一栏外相同,都有用户登录界面,用户可以实现登录、收藏、评论等,但更重要的因,是程序上同步了App内的付费课程,社交功能是带效果。

接到了一个小程序的设计私单,和App设计一样吗?

回刚才的问题,程序是否需要社交功能?要开发程序的主要目的和社交功能的增益效果。比如像知乎头脑者这的程序游戏,需要通过好友间同竞争来「刺激」用户持续答题,因而应有社交功能。

接到了一个小程序的设计私单,和App设计一样吗?

总结

通分析两类应用,我们以探讨以下小程序设计经验。

1. 轻设计

总的来说,小程序相App化繁为简,突出主要功能。还以将并联功能改为串联/触功能来现页面的简化,小红书。

2. 注意统一

小程序的彩、图标、风应和App内一致,但是要考虑目标受众的不同做适量更改。减少banner、物图标的使用,要现页面简化和彩统一。

3. 是否应当使用水平滚动列表

一点从技术上讲是以现的,但是目前大数小程序不采用样的做法,但也有像豆瓣评分样的小程序在使用。水平滚动列表和垂直滚动列表在小程序中是二选一关系,一个若为以无拉动,另一个应为有。

接到了一个小程序的设计私单,和App设计一样吗?

4. 注意载效

小程序容的轻量有一个重要原因——减打开时间,户对于小程序的等待时间要App很多。此时载效就够作为一个留住户的分项。

5. 导航栏样式

小程序的导航栏较为死,配置空间为2-5个,且图标和字空间规定严格。可多使顶导航栏和悬浮导航按钮。如头脑王者就通过「知乎狗」作为悬浮按钮导流户到知乎热榜小程序。

今天的分享就到里,朋们,你们在设计小程序的程中还积累什么经验?以在评论区分享出来哟。

欢迎关注公众号:「优秀页设计」

接到了一个小程序的设计私单,和App设计一样吗?

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

APP和网站这样的数字产品中所包含的有效的交互系统,通常是由包含不同任务和功能的小元素组合到一起的。想要让整套交互系统无...
CTA按钮
目前我主要深耕于B端设计中,深知B端图标设计与C端有很大的不同,无论是应用的场景、设计的理念,都有非常大的差异,而现在网...
B端产品
本文作者通过对产品开发三原则模型:商业可行性、技术可能性、用户期望值的分析,来说明其对于产品设计产生的价值。 一. 什么...
产品开发三原则
编者按:虚拟现实类的APP 要怎么设计?其实你已经可以自己动手设计了,其中所需要注意的要点,都已经汇总到下面的文章里面,...
AR
近期一直在梳理需求收集、需求评审流程,就写一写关于这方面的心得吧。针对评审要注意的事项,我梳理了8个问题,和大家一起聊...
产品经理
对于许多老派的设计而言,字体应该保持字体设计师最初设计出来的样子,觉得不合适的时候选择其他的就好了。不过对更多的设计...
2018设计趋势
开始与大家探讨「设计冲刺 (Design Sprint)」之前,我想先跟大家分享什么是「设计项目群经理(Design Program Manager)」...
Airbnb
@Daidai丶呆 :本篇文章写写近期看到的比较有趣的话题,「一款好产品,所需具备的条件」。 产品角度 早前有看到张小龙说 :一...
ui设计