str2

2018香港马会48期开奖结果开奖现场香港马会开奖结果|六合资料|香港马会六和合彩资料|特码预测|特码资料|特码内幕|内部号码|特码直播

定义页面模板是画APP原型的必备工作

定义页面模板是画APP原型的必备工作

2018-06-24 15:32

  页面模板是画APP原型的必备元素,使用它的PM不少,但是真正了解的不多,用它提升效率的更少。

  所谓的页面模板,是指APP原型中每个页面的相同部分,某种程度上可以理解为开发APP时候前端技术使用的viewcontroller模块。

  我们在用Axure画APP页面的时候,往往会套一个网上下载回来的页面模板,常见的有以下三种样式。还有其他少见的模板我就不赘述了。

  另外上图是自制的低保真版本,网上有提供高保真版本。使用前者,不要混淆PM和UI的工作。

  而不是每画一个APP页面,就重新从状态栏,上,内容区,下/工具栏一个一个画一遍。这样极大的浪费时间。

  所以我提炼出页面模板这个概念,并方便的运用到每个APP页面,以此来减少画原型时间。

  如果我们去拆分页面的内容结构,其实是这样的三个层次。只是往往我们看到的是第一层,不会深入去了解它的内核。

  如果具备立体思维来拆分,我们可以得出大部分时候页面包含上,内容区。小部分时候包含工具栏/下。

  根据的三种常见页面模板,以及页面的内容结构。聪明的PM应该就会自己制作适合自己APP的页面模板。

  不过画法是相似的,如果你会画第3种页面模板,那么第2种,第1种画起来也很快。

  具体的查看方法详见我的文章 《如何在手机上完美体验Axure生成的APP原型》。

  具体的查看方法详见我的文章《Axure如何生成适配手机屏幕的APP原型》。

  如果你的APP原型只需要在浏览器中查看,那么仅需固定页面模板在每个页面中的,比如(10,10)。

  如果你的APP原型想在手机上并体现交互,那么请固定页面模板的为(0,0)并且不能有手机边框。

  如果你的APP原型想在浏览器中预览APP原型交互,那么请固定页面模板的为(0,0)并且不能有手机边框。

  页面模板的尺寸来源于APP原型尺寸,而APP原型的尺寸要么选择375667,要么选择你手机屏幕的逻辑分辨率,注意有别于手机屏幕本身的物理分辨率。详见我的文章《为什么375×667是移动端原型的最佳分辨率》。

  按照iOS人机交互规范来说,状态栏的高度为40px,上的高度为88px,那么内容区的高度则为1334-40-88=1206。另外上左右按钮的高度是22px,宽度至少是22px。

  页面模板是为了方便我们在画APP原型的时候,快速去复制到每一个新页面。所以我们应该用Axure中的母版功能来使用页面模板。

  请右键该母版,然后设置拖放模式为“脱离母版”。然后我们每新建一个页面,拖一个母版进来。

  或者我们设置拖放模式为“固定”,然后每新建一个页面拖一个母版进来,然后右键脱离模板即可。

  但是我们还可以再优化一下,把上图中的所有文字“页面名称”“左按钮”“有按钮”“内容区”都删除,变成下图。

  当不需要填写文字的时候,就不显示左按钮右按钮,兼顾了部分页面不一定都有左右按钮的场景。当我们需要填写文字内容的时候,双击对应的区域即可编辑。互不耽误。

  页面模板并不是特别复杂,但是很少有人刻意过它的来龙去脉以及如何高效的使用它,希望我的这篇文章可以让你们对页面模板有个很深的了解以及提升了你们画原型中不必要的时间浪费。

  【每日一问】第280期:锤子号称要电脑和office办公软件,是吹牛x还是线人关注

  人人都是产品经理(是以产品经理、运营为核心的学习、交流、分享平台,集、培训、招聘、社群为一体,全方位服务产品人和运营人,成立8年举办在线+期,线+场,产品经理大会、运营大会20+场,覆盖北上海广深杭成都等15个城市,在行业有较高的影响力和知名度。平台聚集了众多BAT美团京东滴滴360小米网易等知名互联网公司产品总监和运营总监,他们在这里分享知识、招聘人才,与你一起成长。

热门文章

推荐阅读