APP常见的布局方式有哪些

APP页面布局会直接影响APP的视觉效果,好的布局方式往往会给用户带来舒适的视觉效果。但由於手机屏幕尺寸的限制,很多时候我们都无法将所有内容都在一屏内显示,因此在APP界面设计中,我们就需要进行合理的页面布局把信息更好地展示给用户。

APP常见的布局方式有哪些?

一、常见的图文布局有哪些?

APP常见的布局方式有哪些

◇ 上图下文

上图下文主要强调图片的重要性,再动人的文案还不如一张抓人眼球的图片更有吸引力,一个具有商业化目的的产品对首页版面效率是异常看重的,同样对图片质量的要求也是非常的高。

运用方式:

① 以「大图+文」的上下方式来布局时,一定要找到版面的平衡点,毕竟手机屏幕尺寸比较小,图片太大会影响信息传达和用户浏览的过程。

② 宫格排列式的上图下文能提升版面效率,此排列式更多地适用於电商平台,能达到提高转化和流量的作用。但由於宫格排列式缺乏信息完整度,在布局时需要考虑设备、极限值等带来的问题。

◇ 左图右文(右图左文)

无论是左图右文还是右图左文,都应该做好图和文的比例,图片的选择最好采用详情页中的图片进行展示,避免浪费更多的人力和时间重新配图,此外图片和文字内容的搭配也是非常重要的。

运用方式:

① 方形缩略图是最常用的形式,不会太窄或太宽,对右侧信息的布局会显得更加游刃有余;

② 横形图片虽然会使右侧文字显得空间压缩,但却非常适用於视频APP,这对整个页面的氛围感会更好;

③ 竖形图片会使右侧信息有更多的发挥空间,但是如果右侧信息过少,会使得页面过於单调和不完整;

④ 右图左文适合於资讯类和旅游率产品中,按照人的浏览习惯,如果文字比图片更重要,把图片放到右边会更加合适。

◇ 图文混排

为了让信息传达更一致,且没有大量文字信息干扰我们,则可选择文字与图片混排的布局方式。

运用方式:

为了适应多变的图片,文字底部加一层黑色半透明蒙层或一些无伤大雅的阴影。

二、常见的按钮布局有哪些?

APP常见的布局方式有哪些

按钮使用的场景主要有:主线场景、支线场景以及异常场景,不同的场景使用的按钮布局也会有所不同:

◆ 主线场景

一般主线场景的按钮都是放在页面底部固定显示,不会随着内容滚动,主线场景按钮主要分为两种:通栏和非通栏按钮。

通栏按钮:适合可滚动的页面容器,简单来说就是内容较多在一个屏幕中无发显示全部内容,按钮的优先级会更高;

非通栏按钮:这需要考虑页面内容,如果页面内容很长就需要在按钮底部加上白色背景,尽量不要让内容穿过按钮,与通栏按钮相比,非通栏置底按钮的优先层级并没有那麽高。

◆ 支线场景

支线场景按钮一般分为:图标、文字、图标+文字、框+图文字+图标等。支线按钮的使用场景较为复杂,一般需要通过参考上下文的情景来做不同样式的选择。但为了不打扰主线流程,尽量不要将支线流程的按钮做得太过明显。

◆ 异常场景

异常场景下的按钮不需要做得特别醒目,一般采用幽灵按钮或和背景相似的颜色,这种按钮大多数是希望用户点击将页面恢复状态,并没有很强烈的引导。

好的页面设计离不开页面布局,而页面布局的好坏会直接影响页面的美观。以上是Inspirr Creation提供的APP常见页面布局方式,而这只是其中的一些布局方式,如果你有更多更好的布局方式,欢迎与我们分享!

本文来自投稿,不代表重蔚自留地立场,如若转载,请注明出处https://www.cwhello.com/40545.html

如有侵犯您的合法权益请发邮件951076433@qq.com联系删除

(0)
InspirrInspirr订阅用户
上一篇 2022年6月13日 23:32
下一篇 2022年6月13日 23:33

相关推荐

  • 手机网站制作需要注意哪些细节

    问题:公司准备制作手机网站,现在考虑是给其他网站制作公司做,还是由自己内部制作。如果选择内部制作,手机网站制作需要注意哪些细节呢? Inspirr Creation 解答: 随着手机的普及,越来越多用户选择手机上网,所…

    2022年6月13日
    0145
  • 用户体验:减少输入

    智能预设 在移动端填写表单更是一件困难的事情,即使设计得再有亮点但在绝大多数的情况下都并不会令人感觉愉悦。最有效的方法就是,通过降低输入成本来提升用户体验。最直接的做法是给予用户合理的智能预设,有初始…

    2022年6月8日
    0136
  • APP网页设计技巧:如何对APP界面进行改版设计

    如何对APP界面进行改版设计?为了迎合当前行业和同类型产品的设计趋势,以及用户使用习惯的改变,设计师都会结合之前对自身产品的分析与理解,与多款竞品进行详细比对後,对APP进行改版。下面,南宁网页开发公司将和…

    2022年6月25日 建站资讯
    0456
  • 用户体验的两大黑名单

    1、 没有根据平台性质去匹配相同的图标 界面设计项目如今不再是只在某个平台上呈现,所以需要为多个平台提供成套的图标,如功能类型的:新建、分享、发布、保存、删除等图标。要注意的是,当你在移动端的页面设计要…

    2022年6月7日
    0137
  • APP设计新知:左文右图和右文左图的差异在哪里

    新闻资讯行业从传统纸媒体时代,到PC互联网时代,再到如今的移动互联网时代,用户阅读习惯和媒体转型、技术已有非常大的转变。企业若有计划制作新闻资讯类APP,就需要多留意市面上这类主流APP。 目前市面不少新闻资…

    2022年6月15日 建站资讯
    0514
  • APP设计趋势:如何掌握新拟物化设计的特点

    如何掌握新拟物化设计的特点?自从2011年Windows开始扁平化,到2013年iOS7开始扁平化,扁平化设计突然成为设计潮流,而拟物化风格似乎逐渐在设计舞台中消失。但最近拟物化风格又回归到我们的眼前,甚至升级为新拟物…

    2022年6月25日 建站资讯
    0331
  • 13岁的Facebook保持快速成长的关键因素是什麽

    如果从企业的成长维度来看,13岁的Facebook持续保持快速成长迭代的能力确实值得令人称道,那这其中的关键因素是什麽呢? Mark Elliot Zuckerberg 最不能忍受公司放慢脚步 「Move fast and Break things(快速行动,打…

    2022年6月9日
    0137
  • 怎样的APP loading设计更讨用户欢心

    用户在浏览网页时,由於网络原因可能需要花费一定时间才能加载完成,这个时候就要用到loading加载机制,告诉用户网页正在努力为您加载数据,请稍安勿躁。好的loading设计能减弱用户等待网站加载的焦虑,不合理的loa…

    2022年6月9日 建站资讯
    0176

联系我们

QQ:951076433

在线咨询:点击这里给我发消息邮件:951076433@qq.com工作时间:周一至周五,9:30-18:30,节假日休息