0

INTRODUCTION AND RELEVANT INFORMATION:

I have a desktop application with a window that needs to display large amount of entry fields. Please take a look at below image:

enter image description here

As indicated on the image, controls in the red rectangle should be in main window, other ones can be shown when needed, using progressive disclosure/tabs/etc. I have used purple line to mark related groups of data.

I am using WPF and XAML to create GUI.

MY EFFORTS TO SOLVE THE PROBLEM:

I have tried to break that content into tabs, in order not to clutter the GUI.

I have placed controls from red rectangle into main window, docked them left and then added tab control next to the map. Everything else was placed into appropriate tabs ( groups marked with purple line on the above image ).

PROBLEM:

My problem is that layout can not be fully seen on small laptops despite "breaking" the window into tabs. Since the screen is divided into 3 columns map can not fit properly, it is just a thin vertical line.

I would like to ask here for help, in view of GUI redesign so it can fit into small laptop screens. I am not targeting tablets/phones.

QUESTION:

Is this type of question on topic for this site?

IMPORTANT: I can provide detailed description of every field from the above mockup. I have mockups of the tabs as well (my own effort to solve the problem).

  • Are we talking software design? Web design? Do you need a responsive design for web? Using % and media queries will do the trick. jQuery will also help. Depending on the complexity of the design, floating the entry fields might also help. Anyways, since this is (if I understand correctly) more a coding problem, rather than designing, stackoverflow.com might suite your needs better. – Alin Dec 6 '15 at 17:38
  • @Alin: I apologize for being vague. It is a desktop application, that works with a database. I have enormous amount of data that needs to be displayed, so I tried to break data into small groups and put them into appropriate tabs. I need help with the visual display of the entry fields, I do not think this is a coding issue, but that is only my humble opinion... – AlwaysLearningNewStuff Dec 6 '15 at 17:42
  • I have a hard time visualizing what you might mean by visual display of the entry fields. That's cause I can thing of two things, first is that you might want a responsive design that will auto-adjust depending on the screen width (much like how a website adjust for tablet and phone visualization). The second one is that you are referring on how to arrange your fields in order to fit EVERY media type. A sort of all-in-one static design, but this isn't a good option. – Alin Dec 6 '15 at 17:53
  • Therefore (the way I see it) you need to ask yourself these two questions: 1. How do I want it to look at a width of 1920px, 1366px, 1280px, 1024px, 800px and lower ? (lower usually refers to tablet/phone). 2. How do I code it to target those screen sizes and change my layout accordingly?. – Alin Dec 6 '15 at 17:57
  • After doing some research and trying something by yourself (having something to show and avoid having your question downvoted and closed as to broad), the first question is suited for this website. To get help with the second question, you will have to go to stackoverflow.com – Alin Dec 6 '15 at 17:59
  • @Alin: Thank you for taking the effort to help me, I really appreciate it. I do have a problem with 1st question you mentioned, I do not know how to design layout so my app is usable at any screen size. I do not need coding help at the moment. Please forgive me for being vague, I just do not know how to describe it properly, but I think that you are right, it might be categorized as "responsive design issue". I do have "something" to show and am able to phrase the question in a clear way , providing all relevant information needed for designers. – AlwaysLearningNewStuff Dec 6 '15 at 18:18
  • @Alin: I have edited my question with image and additional details. This should help determine if my question would be on or off topic. – AlwaysLearningNewStuff Dec 9 '15 at 8:57
5

We have an entire tag for which has 4 tag-synonyms

If your question is about design then its on-topic. If its usability it belongs on UX.

Programming questions are off-topic here. HTML and CSS questions if directly related to design are on-topic.

And a poorly worded question that show's no effort is off-topic on any site, design related or not.

  • I have edited my question with image and additional details. This should help determine if my question would be on or off topic. – AlwaysLearningNewStuff Dec 9 '15 at 8:57
2

There's a lot of overlap between UX.se and GD.se when it comes to UI design topics. I'd suggest you ask the question, and then, worse case, it gets migrated to the other area if deemed more applicable there.

I personally believe there are questions that would be equally at home on either site.

  • I have edited my question with image and additional details. This should help determine if my question would be on or off topic. – AlwaysLearningNewStuff Dec 9 '15 at 8:57
  • @AlwaysLearningNewStuff I'd ask that on UX.se – DA01 Dec 9 '15 at 16:25

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .