Click here to Skip to main content
15,892,298 members

Welcome to the Lounge

   

For discussing anything related to a software developer's life but is not for programming questions. Got a programming question?

The Lounge is rated Safe For Work. If you're about to post something inappropriate for a shared office environment, then don't post it. No ads, no abuse, and no programming questions. Trolling, (political, climate, religious or whatever) will result in your account being removed.

 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
V.21-Jun-17 1:30
professionalV.21-Jun-17 1:30 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Greg Lovekamp21-Jun-17 3:12
professionalGreg Lovekamp21-Jun-17 3:12 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Kirk 1038982121-Jun-17 1:58
Kirk 1038982121-Jun-17 1:58 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
SeattleC++21-Jun-17 5:18
SeattleC++21-Jun-17 5:18 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Maximilien20-Jun-17 3:37
Maximilien20-Jun-17 3:37 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
kalberts21-Jun-17 0:31
kalberts21-Jun-17 0:31 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Alister Morton21-Jun-17 3:57
Alister Morton21-Jun-17 3:57 
GeneralRe: Basic UI Design?: Placement, Appearance, Function PinPopular
Foothill20-Jun-17 3:55
professionalFoothill20-Jun-17 3:55 
When I build a UI, there's a couple of fundamentals I use to guide where to put things.
  • Order of importance
    • Most humans start at the top so the most important data and used functions go there
    • Infrequently used elements are put at the bottom
    • Match the culture reading direction: some read left to right, right to left, or top to bottom. Controls should match natural text progression.
  • Group controls
    • If a group of controls displays and manipulates data for a single class of object (or any data), keep them close together.
    • Too much data to fit on a single display? Combat this with drill-down functionality such as tabs, popups**, or dialogs**.
  • Lead the eyes
    • Use borders and colors to naturally lead the eyes to important parts of the UI.
    • The use of darker backgrounds with progressively lighter backgrounds around your functional groups.
    • Use colored backgrounds to clearly demarcate UI parts the have different functions.
And above all, get constant feedback by those who use it during all stages of development; listen to them and incorporate their ideas into the design (if possible Poke tongue | ;-P ).

** Don't use actual popups and dialogs that exist over the top of your app/page. Most users see them as disruptive and annoying. I find the most positive feedback from pseudo-popups that slide/fade in, obscuring your content, in the top visual layer in the app/page.
if (Object.DividedByZero == true) { Universe.Implode(); }
Meus ratio ex fortis machina. Simplicitatis de formae ac munus. -Foothill, 2016

JokeRe: Basic UI Design?: Placement, Appearance, Function Pin
Jeremy Falcon20-Jun-17 5:42
professionalJeremy Falcon20-Jun-17 5:42 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Foothill20-Jun-17 5:44
professionalFoothill20-Jun-17 5:44 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Jeremy Falcon20-Jun-17 5:47
professionalJeremy Falcon20-Jun-17 5:47 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Zterh20-Jun-17 9:12
Zterh20-Jun-17 9:12 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
C-P-User-320-Jun-17 17:06
C-P-User-320-Jun-17 17:06 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
kalberts21-Jun-17 1:03
kalberts21-Jun-17 1:03 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
W Balboos, GHB20-Jun-17 3:58
W Balboos, GHB20-Jun-17 3:58 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Eddy Vluggen20-Jun-17 4:06
professionalEddy Vluggen20-Jun-17 4:06 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
lopatir20-Jun-17 5:25
lopatir20-Jun-17 5:25 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Eddy Vluggen20-Jun-17 5:34
professionalEddy Vluggen20-Jun-17 5:34 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
lopatir20-Jun-17 6:05
lopatir20-Jun-17 6:05 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Eddy Vluggen20-Jun-17 8:22
professionalEddy Vluggen20-Jun-17 8:22 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Rick York20-Jun-17 7:07
mveRick York20-Jun-17 7:07 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
maze320-Jun-17 4:13
professionalmaze320-Jun-17 4:13 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Eddy Vluggen20-Jun-17 4:39
professionalEddy Vluggen20-Jun-17 4:39 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
maze320-Jun-17 5:07
professionalmaze320-Jun-17 5:07 
GeneralRe: Basic UI Design?: Placement, Appearance, Function Pin
Eddy Vluggen20-Jun-17 5:26
professionalEddy Vluggen20-Jun-17 5:26 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.