nqkk58 发表于 2024-8-31 18:29:51

UI设计中落地页设计指南


    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">UI设计创新技能层出不穷,UI设计满足着形形色色<span style="color: black;">各样</span>垂直化的<span style="color: black;">需要</span>,在设计方面<span style="color: black;">大众</span><span style="color: black;">亦</span>是想方设法去做<span style="color: black;">有些</span>创新,<span style="color: black;">期盼</span>自己能够在<span style="color: black;">各样</span>应用中脱颖而出,今天<span style="color: black;">博主</span>就针对UI设计中落地页设计指南进行简单的说明。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">落地页<span style="color: black;">亦</span><span style="color: black;">叫作</span>着陆页,用户点击<span style="color: black;">宣传</span>后<span style="color: black;">表示</span>给用户的页面,简单<span style="color: black;">来讲</span><span style="color: black;">便是</span>让你的用户<span style="color: black;">认识</span>你的<span style="color: black;">制品</span>和服务。落地页<span style="color: black;">始终</span>是转化的核心,一个优秀的落地页<span style="color: black;">针对</span>转化有事半功倍的效果。用户从入口进入落地页,对品牌的印象是在很短的时间内<span style="color: black;">创立</span>的,<span style="color: black;">第1</span>印象<span style="color: black;">亦</span>会影响后面的浏览过程,<span style="color: black;">怎么样</span>让用户在打开的一瞬间就形成记忆点,<span style="color: black;">创立</span>品牌认知,是设计一个好的落地页的挑战所在。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  落地页的特点</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  1.带有<span style="color: black;">知道</span>的目的和<span style="color: black;">目的</span></p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  2.所有的信息为该<span style="color: black;">目的</span>服务</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在<span style="color: black;">咱们</span>的运营设计工作中常常有这种小型的落地页<span style="color: black;">需要</span>,<span style="color: black;">需求</span><span style="color: black;">咱们</span>快速产出高质量的页面。设计师在设计过程中,必须<span style="color: black;">认识</span><span style="color: black;">更加多</span>的细节和原理,用精细化运营的思路来处理看似简单的落地页,<span style="color: black;">才可</span>真正的让转化有质的飞跃,我将从四个<span style="color: black;">过程</span>着手<span style="color: black;">加强</span>落地页的设计效率、产出质量和转化效果。</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/f3d6fed4bf9442db957656069950da53~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=BD5pYhd58DcTXN1ByYFzKy84PbY%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">平常</span>的落地页的<span style="color: black;">需要</span><span style="color: black;">目的</span><span style="color: black;">重点</span>是拉新、促活、引流、收入这四个<span style="color: black;">目的</span>,<span style="color: black;">同期</span><span style="color: black;">伴同</span>着对品牌的塑造和传播,<span style="color: black;">提高</span>品牌美誉度的<span style="color: black;">目的</span>。在面对<span style="color: black;">区别</span>的落地页的<span style="color: black;">需要</span>时,设计师需要先和<span style="color: black;">制品</span>、运营<span style="color: black;">朋友</span>沟通<span style="color: black;">认识</span>宣传的<span style="color: black;">目的</span>,<span style="color: black;">经过</span>对<span style="color: black;">目的</span>的拆解,完成页面信息层级的构建。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  一个好的落地页<span style="color: black;">最后</span>应达到如下效果:</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  1.产生品牌认知</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  2.感到愉悦不排斥</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  3.<span style="color: black;">有效</span>获取有用信息</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  4.产生<span style="color: black;">剧烈</span>的消费冲动或<span style="color: black;">促进</span>其行动</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">了解你受众的用户</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/2ab621ef753e49ad942381168449e0df~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=YvymMLW9kkWjADqyt5gKD%2FFNYqU%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  随着经济的发展,市场<span style="color: black;">亦</span>进入精细化运营模式。消费者倾向于和有<span style="color: black;">一起</span>兴趣、<span style="color: black;">兴趣</span>的人群打交道,从而形<span style="color: black;">成为了</span>特定的社交和消费圈,<span style="color: black;">区别</span>的圈子发展出了独特的圈层文化。<span style="color: black;">仅有</span>深入<span style="color: black;">认识</span><span style="color: black;">区别</span>圈层的「语言」,尊重圈层文化,挖掘专属<span style="color: black;">途径</span>,<span style="color: black;">才可</span>受到用户的<span style="color: black;">爱好</span>。越<span style="color: black;">认识</span>自己的受众人群,越能做出符合<span style="color: black;">目的</span>的设计。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">梳理信息级别</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  1.头图</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/bace335655464f5e9ad6653998e75479~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=Sozvam4gLlQKE%2FqWBwvueG5pPf4%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  头图是用户看到的<span style="color: black;">第1</span>部分信息,<span style="color: black;">亦</span>是很黄金的位置,要用精简的文字或<span style="color: black;">照片</span><span style="color: black;">明显</span>页面<span style="color: black;">重点</span>内容。强化品牌LOGO的露出,<span style="color: black;">提高</span>品牌的认知度,<span style="color: black;">亦</span><span style="color: black;">能够</span><span style="color: black;">加强</span>用户的信赖感。在文案中结合用户很关心的利益点抓住用户眼球,从而吸引用户浏览下面的内容。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  2.正文内容</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/7f52a445344b47b9ad0bb4f84d9db6bc~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=EMUIQ60Q9goZvE%2FTk2gLx%2BFpcFk%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">将精简后的信息可视化展示,利益点、卖点、优惠信息<span style="color: black;">明显</span>展示。用户的时间宝贵,在页面呈现上<span style="color: black;">尽可能</span>精简文字,<span style="color: black;">照片</span>可视化方便用户快速获取核心信息,做出决断。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  3.设置利益点和惊喜点</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/783e47f37d654e3e8ff6632a14e2d166~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=gc39JMVEXE6RQmXjAWcGuHmGvec%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">在页面中重点<span style="color: black;">明显</span>给用户的额外惊喜,让用户有占到便宜的心理。<span style="color: black;">亦</span><span style="color: black;">能够</span>用限量、限时等<span style="color: black;">办法</span>,给用户以紧迫感,UI设计中落地页设计指南 https://www.aaa-cg.com.cn/ui/2488.htm?gpf使得用户快速做出决策,数据<span style="color: black;">表示</span>给用户设置的额外惊喜越<span style="color: black;">详细</span>真实越有吸引力。例如<span style="color: black;">一样</span>是邀请好友得奖励,图中案例一文案是:邀请好友,得福利,案例二是:邀好友,得88元红包,相对而言88元<span style="color: black;">详细</span><span style="color: black;">知道</span>,对用户吸引力更大。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  4.案例</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/8a81961cb22b43c28baeba7218b8bcfd~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=tdFHH6vSQ0VugoUglzuL9bwsorQ%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">真实的客户案例能够<span style="color: black;">提高</span>用户的信赖感,真实的数据让信息更令人信服。在页面设计的形式上<span style="color: black;">能够</span>采用<span style="color: black;">上下</span>滑动的交互形式,缩短页面高度,<span style="color: black;">提高</span>阅读效率。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  5.<span style="color: black;">显著</span>的按钮设计</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/8d0670efca344e89a146bf2923789e37~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=HgPv6LMAij2gDxQ7KWb9ylYbI%2FM%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">按钮是关系到页面的<span style="color: black;">最后</span>转化的重要元素,在按钮的设计上要更加费心。好的文案能够引导用户进行下一步的操作,而糟糕的按钮文案会让用户产生压力,不敢进行下一步操作。例如图示中按钮一文案是:立即支付99元/年,给用户命令感过强,<span style="color: black;">无</span>强调用户的利益。按钮二:立即开通会员,标明现价99元,原价198元/年,给用户一种占到便宜的感觉,更有利于用户决断。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  6.入口与落地页的呼应</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">好的落地页更需要来自入口的导流,入口形式多样,但<span style="color: black;">最后</span>呈现仍然由:文案加图形<span style="color: black;">构成</span>。<span style="color: black;">针对</span>设计师而言图形的重要性不必多说,但<span style="color: black;">咱们</span><span style="color: black;">一样</span>需要在文案上花费精力。简明扼要通俗易懂是文案的基本<span style="color: black;">需求</span>,<span style="color: black;">倘若</span>能<span style="color: black;">导致</span>用户共鸣才算是好的文案。<span style="color: black;">同期</span><span style="color: black;">咱们</span><span style="color: black;">发掘</span>入口的风格和形式和落地页最好保持一致,用户点进落地页之后的接受度更高,<span style="color: black;">倘若</span>只是为了博点击,在入口处<span style="color: black;">运用</span>与落地页无关的元素<span style="color: black;">或</span>夸张的文案,反而会适得其反。</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  形成模板快速复制</p>
    <div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/pgc-image/3ac20956f821403ab71b4b8ddb63ff37~noop.image?_iz=58558&amp;from=article.pc_detail&amp;lk3s=953192f4&amp;x-expires=1725675313&amp;x-signature=2jpsfvv4WYgxqTXIC4KA0DTaA3U%3D" style="width: 50%; margin-bottom: 20px;"></div>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">  总结</p>
    <p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">每一个</span>落地页都服务于特定的<span style="color: black;">目的</span>用户,<span style="color: black;">全部</span>落地页的设计其实<span style="color: black;">最后</span>都是为关键数据服务,用来阐述产生转化的<span style="color: black;">全部</span>路径。<span style="color: black;">亦</span><span style="color: black;">便是</span>用户<span style="color: black;">行径</span>的产生需要用户<span style="color: black;">需要</span>为<span style="color: black;">基本</span>,需要<span style="color: black;">保准</span>页面的易用性,<span style="color: black;">然则</span>这还<span style="color: black;">不足</span>,在这个<span style="color: black;">基本</span>上<span style="color: black;">咱们</span>还需要在页面中<span style="color: black;">经过</span>设计触发用户。完成转化的三个关键要素是,动机、能力、触发,缺一不可。落地页设计的重点是触发用户动机,<span style="color: black;">从而</span><span style="color: black;">提高</span>页面转化。</p>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;"><a style="color: black;">UI设计中节</a>日闪屏设计指南</h1>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;"><a style="color: black;">UI设计中下拉刷新设计<span style="color: black;">运用</span>技巧</a></h1>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;"><a style="color: black;"><span style="color: black;">怎样</span>做好UI底部导航栏图标设计</a></h1>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;"><a style="color: black;">UI界面下拉菜单的设计,你真的会吗?</a></h1>
    <h1 style="color: black; text-align: left; margin-bottom: 10px;"><a style="color: black;">ui设计数据可视化设计攻略</a></h1>




5ep9lzv 发表于 2024-9-6 18:38:37

认真阅读了楼主的帖子,非常有益。

qzmjef 发表于 2024-11-7 01:34:11

回顾历史,我们不难发现:无数先辈用鲜血和生命铺就了中华民族复兴的康庄大道。
页: [1]
查看完整版本: UI设计中落地页设计指南