2

I have an app that provide the functionality to create two different concepts: "Rooms" and "Conversations". I need to place two buttons, one for each, in home page of the app.

I think that is very important to add the name of the action, but I'm not sure about the button position. What do you think?

:)

enter image description here

Improve this question
3
  • Hi Meika, could you provide us with a bit more information? What happens once the user taps on "rooms" and "conversations"? Are there any other actions the user can take from the home? What kind of navigation do these 2 icons provide (i.e., Hierarchical, Flat , Content- or experience-driven)? I think a good starting point are the "iOS Human Interface Guidelines", you can find them here: developer.apple.com/library/ios/documentation/userexperience/…
    – Eleonora Zucconi
    Commented Oct 26, 2014 at 19:25
  • Hi Eleonora. When you tap in "room" or "conversation" would can to see two steps for make a room or conversation (add picture, subject, contact..) Conversation are right now, and rooms are for other day. In home, you will see a room list and a conversation list. And, this app is not for iOS :) Thank you Eleonora :)
    – Meika
    Commented Oct 26, 2014 at 19:49
  • Hi Meika, are you referring to Android's floating action button? It does look like the button in your mockups. In that case have a look at: google.com/design/spec/patterns/… Over there the action button is explained, and to me it seems that the best way is to design the button as in your first screen. So you position the button near the footer and make it morph into two related actions (in your case), then just drop the X button to close the related actions again.
    – dirk
    Commented Oct 27, 2014 at 9:51

2 Answers 2

Reset to default
1

In general, all solutions except for B work. B requires specific hand placement on the device (size of the handset was not considered) to reach the buttons comfortably. C, F, and G don't deliver enough context because of the lack of text; you're right, the notion of a room versus a conversation needs to be expressed in text because the icons do not express the action directly.

A's icons are too small, and E is ugly because the text doesn't line up within the button and the buttons are huge (which will also pose an issue with different screen resolutions). H is also very iOS-style. I recommend D or G; I also recommend removing the cancel function entirely as a standalone button and allow the user to cancel by hitting the physical back button or anywhere else on the screen that isn't the two create functions.

Finally, I'd ask can a conversation be made without a room present? Because if so then you have a data problem where in theory a user can create a conversation without a room. Further, if there can be one without the other, how are they differentiated? These seem like much more challenging issues to tackle in your designs (though if you've already gotten past those, congrats!)

Improve this answer
0

My thoughts

  1. Use both descriptors and icons. (Eg the conversation icon)
  2. Create a pattern language for you app (inc gestures)
  3. There are two ways you can structure IE if it is hierarchical such as you drill from room to conversation or frequency of usage. If if users are more likely/often press the conversation button make this the first button or the first left or top as we scan left to write and top to bottom. Similiarly if there is a recommended choice make it first (priming for action)

Keep it simple

Based on these D gets my vote.

Best of luck

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.