APP首页设计案例教程

　　一个APP的首页是一个产品的门面，对能不能吸引用户继续使用起到关键的作用。一个体现产品风格和符合用户的首页怎么设计呢?下面的教程是APP首页设计教程，为你讲解APP首页设计流程。

　　1、APP首页设计案例教程介绍

　　课程从新手的角度讲起，教会大家如何快速掌握本次课程的知识，并且快速做出作品。

　　课程适用于UI设计师，设计院校学生及设计爱好者，想要学习的朋友可以点击下面的链接进行学习。

　　点击试学：APP的门面《购物类首页设计》讲解与实例

　　2、电商app首页设计方法

　　明确表达图标的含义

　　去掉图标文案之后界面会显得更“逼格”，可是你确定用户能看懂图标表达的含义吗?我们在进行界面设计时，图标是为了辅助说明文案所传达的信息，如果去掉文案信息，那么需要图标本身带有很强的信息传达能力，确保用户能正确的识别。

　　表达按钮属性

　　按钮的设计必须要清晰准确的传达出当前状态，不能为了视觉效果而带给用户错误的判断，例如深灰色的按钮用户会理解为是禁用状态而放弃点击。

　　线条与色块分割的合理运用

　　线条通常用于分割同一类别或拥有相同属性的元素;而色块更多的是用于分割不同类别或者区分不同属性的元素，以达到层次清晰，归类明确的目的。我们在选择分割形式的时候要根据信息之间的关系作出明确的表达，不可为了视觉效果而盲目的穿插运用。

　　处理文字排版

　　工作中我们拿到的需求总会出现大篇幅的文案，不能像概念设计那样任性的删减，在进行文字排版的时候，正确的处理信息之间的层级关系将会提高用户对信息的识别度。我们通常会通过字体大小、颜色、留白、层级分割等技巧来处理，把相同属性的信息归类设计，通过留白的不同达到层级的区分，让整个信息排列主次分明，层级清晰。

　　3、如何快速制作一个App首页

　　创建应用

　　打开墨刀软件，新建一个应用，选择应用类型，输入应用名称，设备类型和应用尺寸，点击创建按钮，完成应用创建。

　　制作底部导航栏

　　制作导航栏，从左侧“组件”栏目中找到底部组件，拖入应用之中，大小和样式可以自行修改。然后拖入三个导航标签，修改标签的位置和名称。至此完成底部导航栏的制作。

　　制作原型页面

　　在左侧的“组件”栏目中找到搜索组件，拖入App首页中，在“母版”栏目中找到轮播图模版，拖入应用之中。墨刀中有一些已经做好的组件或母版，可直接拖入使用，加快创建原型的时间。

　　然后回到“组件”栏目，为首页插入图片和文字。图片调节在右边的设置栏。

　　创建页面

　　在软件右上角点击“+新页面”即可生成新的页面，每一个页面有复制、删除、添加子页面的功能。在新的页面中添加标题栏，复制首页的底部导航，粘贴至新的页面，注意粘贴时用于粘贴至“原位置”。按如此方式制作“发现”页面和“我的”页面。

　　添加手势

　　在左侧“组件”栏目找到全局手势组件，拖入至应用的任意位置，然后选择你要发动手势后跳转的页面，选择手势方式和动画效果即可。

　　这么好的教程不学习就可惜了，让我们一起学习该教程吧!

　　点击，就可以免费试学!

　　APP的门面《购物类首页设计》讲解与实例