I'm developing a remote control that will be used to control a web browser running within a smart TV and need some help. I'm interested in how I can place controls in such a way that it is both intuitive and ergonomic for repeated use.
I would like the user to have the following functionality:
Nice to have:
I'm trying to lay out all of this functionality within a variable space (iPhone family from 5 to 6 plus, portrait and landscape).
Please see my attempts so far:
Are there better ways to both ergonomically and intuitively lay out buttons on a large phone screens?
I agree with the comments mentioning the need to capture frequently used browser functionality but given the controls shown in your mock-up (7-8 items) I think a possible solution could focus on the following:
1. Grouping controls in one location: By doing so you can remove clutter, preserve some room to scale-up if you need to include additional functionality, and pave the way for:
2. Handing-over control to users: having controls in one location could provide users with means of deciding how exactly they would like to use the remote by ordering items in the order they desire.
The mockup below incorporates these thoughts:
Feature-richness vs ergonomic minimalism is a key tradeoff here. You want the remote to be fully featured, but to be simple enough to use that it's not intimidating. That is a balance that most remotes do NOT get right.
Circular shapes are problematic here. I understand why you would use circular shapes because they are 'friendly'. But once you have multiple circles onscreen it start feeling really cluttered unless the circles are very carefully laid out, typically in a regular grid structure.
Hide or show buttons? Different users have different expertise/needs, so it's hard to figure out whether to show or hide buttons (e.g. layout #1 vs #4)
High contrast purple-on-white causes very stark boundaries so the interface feels a bit jarring.
A designed approach (click to enlarge):
Allows the user to show or hide additional buttons, depending on their level of expertise. This is an approach borrowed from Samsung's TouchWiz interface.
Provides a familiar browser bar that idiomatically follows browsers (Chrom, FF, Safari) that users are already familiar with.
Conforms to the thumb-friendly layout that you've tried to design to.
BTW I like the left approach much better than the right approach (it's less intrusive, respects the trackpad area better, etc), but thought I'd give 2 alternatives.