1

I am designing a desktop application that has login functionality. The login dialog is placed on the main form and is only shown on startup, and it is not a part of my question.

In the main view, I need to show who the user is currently logged in as, and also provide a log out function.

My current solution is: I have placed the information in the menu bar, the header is called "Log in (NAME)". It just displays the name of the user, it has no function other than to open a menu. The menu has just one item in it called "Log out".

Something about this design doesn't seem right. The other menu header have the usual names like "File", "Actions" and "Help". The name "Log in (NAME)" stands out. enter image description here

What would you suggest..?

EDIT: Final design:

enter image description here

Improve this question
2
  • 1
    could you provide some images?
    – Dimitra Miha
    May 22, 2017 at 9:45
  • I posted an image.
    – Rye bread
    May 22, 2017 at 11:03

4 Answers 4

Reset to default
1

I don't understand why you would have the users name as a menu item that only gives one item to select. This is not good UX.

My suggestion would be to build upon what Dimitra suggested with option 3, and have the users name visible in the top right. Its the expected location for login information. However i would not force the user to interact with the name to only find one option listed. I would alter the label so that it says, "Log out [NAME]". or if you have space, "Not [NAME], Log out."

Improve this answer
2
  • So use a button to log out...?
    – Rye bread
    May 23, 2017 at 10:22
  • I would use the word Logout, as the "x" icon is not enough to indicate user logging out. It doesn't have to look like a button i guess as long as it's clear to the user what the action will be after they interact with the button/link.
    – Peter
    May 23, 2017 at 14:20
2

My suggestion is to differentiate the menu with the user logged in.

I have created 2 different ways that you can do, as the following image:

  • 1st: Next to application's name
  • 2nd: On the bottom part of your application, just like outlook.

In the 3rd screenshot, I have placed the name on the menu, because I think that if it is right-aligned, it would be clear that this is something different than the menu itself.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

Improve this answer
1
  • This look good, but #1 and #2 doesn't have a location for the "Log out" function.
    – Rye bread
    May 22, 2017 at 12:34
0

Having a menu label "Log in (User)" sounds like an action. It starts with a verb (Log in, to log) which indicates an action. The other menu items are not. File, actions and help are not actions. They are menu labels.

Try having a menu item called just '(User)' with the drop down. Maybe add a profile picture of background color if you want it to stand out more.

Improve this answer
1
  • Replacing the word "Log in" with an icon seems like a good idea. The menu is different from the rest since it has dynamic text, so it seems right to make it stand out.
    – Rye bread
    May 22, 2017 at 9:15
0

Login (name) doesn't look right and feels unorthodox. Moreover, you are potentially giving away some security by identifying a user.

Stick with Login as a menu item and in logged in state, name of user. When clicked this gives a menu with more options one of which is logout.

Improve this answer

Your Answer

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

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