触摸屏上最小的按钮尺寸
我正在参与为医疗设备编写触摸屏应用程序。 该程序类似于信息亭，因为用户无法访问开始菜单等，并且用户将使用屏幕键盘在他们需要的罕见情况下键入任何文本。 规格屏幕尺寸为 1280x1024。
问题是：一个合理的界面的最小可触摸按钮尺寸是多少？ 我认为美国一角硬币在各个方向上都是合理的最小尺寸，原因是一角硬币大约是我们可以预期人们用手指感觉到的那么小（根据美国硬币协会的数据，它的直径为 17.91 毫米）万能的维基百科）。
还是大尺寸的一角钱有点大？
编辑：一些关于我们用户的额外知识。 由于设备的性质，他们必须双手，并且不会戴手套。 他们必须能够操作尺寸最大为 14x17 英寸的胶片暗盒（同样，由于设备的性质），因此我有理由相信他们具有一定的手动灵活性。
I'm involved in writing a touchscreen application for a medical device. The program is kiosk-like, in that the start menu, etc, will not be accessible to the user, and the user will use an onscreen keyboard to type any text in the rare event that they need to. The spec'd screen size is 1280x1024.
The question is this: What's the minimum touchable button size for a reasonable interface? I'm thinking that an American dime is a reasonable minimum size in all directions, with the reasoning being that a dime is about as small as we can expect people to feel with their fingers (it's got a diameter of 17.91 mm, according to the almighty Wikipedia).
Or is a dime a bit on the large size?
EDIT: Some extra knowledge about our users. They have to have both hands, because of the nature of the device, and they will not be wearing gloves. They would have to be able to manipulate film cassettes of up to 14x17 inches in size (again, due to the nature of the device), so I feel reasonably confident that they have some manual dexterity.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
有很多因素会导致按钮变得更大。
根据我的经验，我会使用不小于美国25美分硬币的东西——一角硬币对于重复使用来说确实太小了。 如果用户戴着手套或其他东西来“增粗”手指，则您将需要更大的按钮。 如果您的用户有残疾或运动控制能力差（比您想象的更常见），那么一毛钱大小的按钮绝对没有用。 请记住，某些触摸屏并不是特别准确。 我曾经处理过一些边缘附近最多有 25 像素的偏差。
另外，他们多久按下一次按钮以及屏幕上会显示多少个按钮？ 必须依次点击许多小触摸屏按钮会让用户发疯。 这就是您会注意到许多触摸屏系统（例如 ATM）开始配备超过 1 英寸 x 2 英寸按钮的原因之一。
另外，如果他们不小心按错了按钮，系统的容错能力如何？ 也许是因为屏幕关闭或者他们从某个角度观看？ 容错性越低，按钮就需要越大。 错误会发生。 较小的按钮意味着更多的错误。
There's a lot of factors that go into this that can require the buttons to be a lot larger.
Based on my experience, I would use something no smaller than a US Quarter--a dime is really too small for repeated use. If users will wear gloves or other things to "fatten" the finger, you will need even larger buttons. If you have users who are disabled or have poor motor control (more common than you would expect), a dime sized button is absolutely useless. Keep in mind that some touch screens are not particuarly accurate. I've worked with some that were up to 25 pixels off near the edges.
Also, how often are they pushing the buttons and how many buttons will be on the screen? Having to hit many small touch screen buttons in sequence will drive users crazy. That's among the reasons you'll notice that many touch screen systems such as ATM's are starting to have buttons that are in excess of 1 inch x 2 inch.
Also, how fault tolerant is the system if they accidently push the wrong button? Mabye because the screen was off or they were viewing from an angle? The less fault-tolerant it is, the bigger your buttons need to be. Mistakes happen. Smaller buttons means more mistakes.
这在很大程度上取决于设备本身以及您在其上放置的用户界面。
许多触摸屏（不包括多点触控）都会平均触摸区域，因此您可能不希望将 UI 项目放置在比指尖区域更近的位置，以减少误触摸。
触摸屏需要在安装后进行校准，即使这样，根据屏幕类型或观看屏幕的自然角度，也可能存在一些视差。
您还可以考虑触摸时的视觉反馈，并且仅在触摸释放时让事件通过。 当您进行触摸时，以接触点为中心显示一个比指尖大的 x，并让它跟踪直到触摸被释放。 该点就是点击点。
最重要的是，用户测试，用户测试，用户测试。
如果您真的担心大小，请使其流畅，以便您可以轻松更改它并在真实情况下对真实用户进行测试。 我有没有提到用户测试？
That's going to depend a lot on the device itself as well as the UI that you're putting on it.
Many touchscreens (excluding multitouch) average the area touched, so chances are you don't want to put UI items any closer than fingertip area to cut down on mis-touches.
Touch screens need to be calibrated post installation, and even then there might be some parallax depending on the screen type or the natural angle from which the screen is being viewed.
You might also consider visual feedback on touch down and only let the event through on touch release. When you get a touch, display an x larger than a fingertip centered on the point of contact and let it track until the touch is released. That point is the click point.
Above all, user test, user test, user test.
If you're really worried about size - make it fluid so you can change it easily and test it on real users under real circumstances. Did I mention user testing?
取决于很多因素...
所有触摸屏都会随着时间的推移而退化，并随着时间的推移提供不太准确、更多噪音和更少线性的结果。 随着时间的推移，电阻式触摸屏已经有了很大的改进，但您仍然会遇到问题，尤其是对于如此大的触摸屏。
此外，人们的手指大小不同，手/眼协调水平也不同。
最后，在进入应用程序之前实际处理触摸的硬件和软件需要进行校准和表征。
因此，这确实比仅仅询问按钮需要多大要困难得多。
首先，我会与触摸屏本身的制造商以及硬件/软件接口的制造商交谈，并找出他们的建议。
其次，我会做一些测试 - 在屏幕上制作一些目标，然后记录当您按下它们时触摸屏硬件向您发送的所有点。 对快速刺按、长按、轻按等进行一系列测试。查看输入跳动的程度（您可能会感到惊讶......）以及它实际响应的速度（重度过滤可能会使按压延迟） ，这可能会在没有快速反馈的情况下降低可用性）。
第三，我会设计用户界面以获得良好的用户反馈。 让按钮比手指宽，这样当用户按下按钮时，他们仍然可以看到按钮的一小部分，并且按下按钮时按钮看起来会被按下。
第四，我会考虑添加适应性学习。 您必须偶尔进行校准运行和重新运行，但在此期间您可以根据用户进行稍微调整以减少出错的可能性。 不过，这不适合胆小的人，而且很容易做错，所以如果你想考虑的话要小心。
-亚当
Depends on so many factors...
All touchscreens degrade over time, and give less accurate, more noisy, and less linear results over time. Resistive touchscreens have vastly improved over time, but you'll still have issues, especially with such a large touchscreen.
Further, people have different sized fingers, and different levels of hand/eye coordination.
Lastly, the hardware and software that actually processes the touches before it even gets into your application needs to be calibrated and characterized.
So it's really much more difficult than merely asking how big the buttons need to be.
First, I'd talk to the manufacturer of the touchscreen itself, and the manufacturer of the hardware/software interface and find out their recommendations.
Second, I'd do some tests - make a few targets onscreen, and then record all the points that the touchscreen hardware sends you when you press them. Do a bunch of tests for quick jabbing presses, hard long presses, light presses, etc. See how much the input jumps around (you might be surprised...) and how fast it actually responds (heavy filtering might make the presses come late, which could reduce usability without speedy feedback).
Thirdly, I'd design the user interface for GREAT user feedback. Make the buttons wider than the finger so that when the user presses it, they still see a little of the button, and it appears to depress when the press it.
Fourthly, I'd consider adding adaptive learning. You'll have to have calibration run and rerun occasionally, but in-between you can adjust to the user slightly to decrease the likelihood of errors. It's not for the faint-hearted, though, and is easy to do wrong so take care if you want to consider it.
-Adam
我有点同意James的观点，即美国25美分硬币是更好的目标，但通常您可以更改它，因此它在一个维度上是一个美国硬币，在另一个维度上是一个美国一角硬币。 当然，您希望活动 UI 元素的中心彼此分开至少一美分硬币的距离，具体取决于点击错误元素的“可解决性”程度。 （如果所做的只是选择一个列表中的错误元素，那么单击列表中的错误元素是很容易解决的；单击对话框的退出按钮则不然。）
请确保使最常见的情况真正易于执行。 这通常意味着制作一个非常大的按钮； 或者，有时，使整个 UI 区域“可点击”（但如果这样做，用户通常会更好地看到该区域中的某种按钮，暗示他们可以点击它。
）触摸屏时，您经常可以在边缘周围“作弊”。 边缘和角落不仅在传统的基于鼠标的界面上最容易被击中，而且也适用于基于触摸屏的界面，因为用户可以将手指直接按在框架元素上，而不必担心触发其他内容。 确保您的 UI 元素接受一直到屏幕边缘的点击（如果它们也靠近边缘）。 使用此功能，您可以在每个角落都有一个美国一角硬币大小的按钮，该按钮仍然可以重复点击（尽管如果用户的手指较大，则可能缺乏反馈）。
I would agree somewhat with James that a US Quarter is a better target, but often you can change that so it is about a US Quarter in one dimension, and a US Dime in the other. Of course, you want to keep the center of active UI elements separated from each other by at least the distance of a US Dime, depending on how "solvable" clicking on the wrong element is. (Clicking on the wrong element in a list is easily solvable if all that is being done is selecting it; clicking on the exit button of a dialog isn't so much.)
Be sure to make your most common cases really easy to do. This usually means making a really big button; or, sometimes, making a whole UI area "clickable" (but if you do that, it's often nicer to the user to also see some sort of button in the area to imply they can click on it.)
Depending on the quality of the touchscreen, you can often "cheat" around the edges. Not only are the edges and corners easiest to hit on a traditional mouse-based interface, but they can be for touchscreen-based interfaces as well, since the user can press their finger right up against the framing element and not worry about triggering something else. Make sure your UI elements accept clicks all the way to the edge of the screen if they are near the edge, as well. Using this, you could have a US dime-sized button in each corner that would still be very repeatably clickable (although possibly lacking feedback if your users have large fingers).
越大越好，因为我们知道尺寸很重要。
对于触摸屏界面的用户来说，在单击屏幕上的某个位置时获得反馈非常重要，因为这不能像普通键盘或鼠标按钮那样是机械的，我们使用声音和/或改变颜色。
仅在单击控件时播放声音，而不是每次触摸屏幕上的任何位置时播放声音，以实现良好的可用性。
如果工作环境嘈杂，您也必须提供颜色反馈，在这种情况下按钮应该比手指大两倍或三倍。 重要的是，当用户的手放在屏幕上时，用户可以看到反馈，并且您知道手不是来自玻璃。
在屏幕上订购也很重要。 对于鼠标驱动的界面，使用下拉组合、菜单等很好，但对于触摸屏，你会失去它们的可用性。 因此，不要将控件放置在屏幕的左上方，而是将它们放置在右下角。 这将使您的用户在工作时可以在屏幕上腾出双手信息区域。
还要考虑左/右手布局以及日/夜配色方案。
目前，我正在努力为触摸屏创建一组 .net UI 组件，您可以很快在我的网站上查看演示。
阿塔纳斯
Bigger is better, as we know size matters.
It is important for users of touchscreen interface to get feedback when click somewhere on screen and because this cannot be mechanical as on normal keyboard or mouse button we use sound and/or changing color.
Playing sound only when control is clicked instead of each touch anywhere in screen to achieves good usability.
If working environment is noisy you must give color feedback too, and in this case button should be twice or triple bigger than finger. It is important that user can see feedback when his hand is on screen, and you know that hands are not from glass.
Ordering on screen is important too. For mouse driven interface using of drop downs combobxes, menus and etc is good, but for touch screen you will kill usability with them. So instead of placing controls in upper left part of screen put them in bottom right side. This will give your users free of hands information area on screen when they works.
Think about left/right hand layout, and day/night color scheme too.
Currently i am working to create set of .net UI components for touch screen and you can take a look for demos soon on my web site.
Atanas