发布时间：2019-10-6 分类： 行业资讯
这一概念使单手操作即使在大型移动设备上也能轻松浏览代购源码网站。
在移动应用程序设计中，选择汉堡菜单按钮或标签栏作为导航一直是一个古老的争议。目前，似乎由于手机屏幕尺寸的增大，标签栏的导航功能在用户中越来越受欢迎。
与移动应用程序的标签栏导航相比，大多数代购源码网站仍然使用汉堡菜单按钮作为主要导航。虽然这种导航方法不能单手操作大的移动屏幕尺寸。
确定关键用户痛点
大多数时候我们都会在忙碌时使用手机。例如，当乘公共汽车或散步通勤时，我们希望能够与手机进行快速互动，甚至是单手操作。在这种情况下，我们的另一只手经常带着一个袋子，拿着一杯咖啡，或者在公共汽车上放一个扶手。
在大型设备上使用时，单手使用传统的站点导航尤其具有挑战性，因为汉堡按钮始终位于屏幕的左上角或右上角。
挑战
多年来，越来越多的设计师和开发人员决定在代购源码网站底部放置一个固定的导航栏。在桌面视图的情况下，这类似于固定标题导航，但在移动设备上，它粘在屏幕底部而不是顶部。
之后，汉堡菜单按钮旁边还有其他操作项，例如电话，电子邮件和方向指示器，用户可以用一只手快速访问代购源码网站中最重要的元素。
但是，在iPhone X上，此解决方案不再可用，因为访问主屏幕的指示器始终位于页面内容的顶部，使得所有底部定位导航都很容易忘记。
执行：设计
为了创建一个易于使用的代购源码网站导航解决方案，使其适用于所有移动设备，包括iPhone X，我在屏幕底部创建了一个浮动菜单按钮。
无论用户是用右手还是左手操作，最好与该固定位置浮动菜单按钮进行交互。为了开发一个不受圆形屏幕或重叠主屏幕指示器影响的解决方案，我决定使用一个按钮而不是与屏幕宽度相同的导航栏。我将此快捷菜单按钮放在屏幕底部附近，但不要太靠近屏幕边缘。这种方法使用户可以轻松访问并且不受重叠的UI元素或圆形屏幕的影响。
通过单击浮动菜单按钮，用户可以完全访问站点导航，并可以快速执行某些交互，例如呼叫公司，发送电子邮件或根据公司的地址导航地图。
（此解决方案的唯一缺点是，如果您想要点击iOS Safari屏幕底部的任何元素，首次点击后只会显示Safari选项卡，直到第二次点击后才会激活代购源码网站导航当然，为了能够用一只手操作网页，你需要权衡两者的优缺点。如果浮动按钮位于正确的位置，它可能会逃避iOS Safari的检测并立即开始导航第一次点击。）
执行：原型
在原型设计过程中，我的目标是创建一个快速，简短，响应迅速的交互，同时从开发人员的角度确保可行的原型。
https://dribbble.com/shots/3851367-iPhone-X-Web-Navigation-Idea
思
这一概念使单手操作即使在大型移动设备上也能轻松浏览代购源码网站。
但是，这个概念仍然需要进行优化，例如在屏幕底部始终可见的浮动导航按钮（可以某种方式构建，仅在用户开始向上滚动时可见，在向下滚动时消失）。
如果您有其他想法可以让您的手机导航更好，更容易使用，请随时与我分享！
原作者：Daniel Korpai
原始地址：https://medium.muz.li/iphone-x-web-navigation-concept-c06efc0e0c50
本文由Mockplus团队翻译出版，未经许可不得复制。
