Icon View Thread

The following is the text of the current message along with any replies.
Messages 11 to 20 of 28 total
Thread OT - Looking for a good read on application UI design
Wed, Nov 4 2015 4:23 PMPermanent Link

Adam H.

Hi Raul,

Thanks for those links. I'll have to check them out. Mine is desktop
based, so the Microsoft link will probably be the most relevant but it
won't hurt for me to check out the other stuff as well.

Cheers

Adam.
Thu, Nov 5 2015 5:59 AMPermanent Link

Roy Lambert

NLH Associates

Team Elevate Team Elevate

Adam

>I don't have a huge experience with web design but primarily I want to
>konw what is and isn't available for me as an application developer.

That seems to be a totally different question.

>I was looking more for stuff as to how to use group boxes, align
>properties (alclient/altop), etc - how to lay out various forms and
>different options for components.

Best way I've found over the years is rough it out and ask the poor soul who's going to spend his life in front of it. I've also found that most users need a physical interactive example to play with. Its why RAD should be so good (often isn't) since it allows you to get something in front of them quickly.

>I've also seen come groupboxes where the top is completely bolded /
>shaded with the caption embedded - (similar to the forms title bar) as
>opposed to a single line border with the caption in the middle which I
>like the looks of as well.
>
>These things combined have me wondering how many ideas, etc I'm not
>aware of - and I thought a good read dedicated to developers as opposed
>to websites may give me a better idea of what's available and what's not.

Errm websites, developers. Remember the people who produce websites are developers, just with a different toolset, and often mindset.

Simple choice you can stick with the whoever it is owns Delphi this week's choice of components, buy a set, or roll your own. I started by using Delphi's, wanted to prettify my apps so bought TMS's (couldn't justify the cost for DevEx), came to dislike them and rolled my own which is what I'm still using.

For freebies you can look at Torry.net

> From a color perspective I guess websites and apps would probably be
>similar.
>
>> Also what are you using to give users a choice about colours?
>
>At this stage my applications have used mostly the same colors, and use
>things such as clWindowText, clwindowxxxx, etc - so they can change the
>color with the theme of their computer.

That half works Smile

I wrote my own appearance manager. If you want a copy let me know. Its dedicated to my homebrew components but is easily adaptable.

>In the end, I see some people who just tend to develop really nice
>looking applications - and then I look at mine and think they could do
>with a tweak. Wink

OK. Look at the one's you admire. Is it the layout, the colours, the components or what. Then copy copy copy

OR develop your own style and apply it. Simpler & sparse is generally better. One thing I would recommend is not to follow the MS rollercoaster of look & feel. I don't think they're making many friends these days.

Roy Lambert
Thu, Nov 5 2015 7:42 AMPermanent Link

Matthew Jones

Roy Lambert wrote:

> Best way I've found over the years is rough it out and ask the poor
> soul who's going to spend his life in front of it. I've also found
> that most users need a physical interactive example to play with.

Putting something out and trying to use it is always good. My web shop
has an admin page, and it has a number of links that do various things
around a given order. Everything was there, and it was okay, but when I
re-did it in EWB2, it was obvious to me that there was no logic. So I
pondered, and then re-arranged to order them in the order that you, as
administrator, need to do things. So anything to do with getting the
order to the customer is on one column, and the back-end stuff is now
in another. It is so much easier to use now, and I think I was only
able to do that because I actually used it for real, and had something
to niggle at me for improvement. Iterating, and not accepting the first
pass, will help a lot.

--

Matthew Jones
Thu, Nov 5 2015 2:11 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Adam,

<< I'm looking to improve on my application design - especially when it comes to the look and feel of it, or the user interface. >>

The key question to start with is this:  are you targeting Windows 8 and higher ?  And, if so, do you want your application to have a more "Metro" look to it ?  The UI guidelines have changed a bit between Windows 7 and 8, although not as much for desktop applications.

Another question is: do you want to stick with the VCL and standard Windows controls, or do you want to do something more adventurous such as FireMonkey ?

Tim Young
Elevate Software
www.elevatesoft.com
Thu, Nov 5 2015 5:45 PMPermanent Link

Adam H.

Hi Roy,

Thanks for your reply.

I do have devex components. Athough I know it's one thing to have the
tools - it's another to know how to use them correctly. Smile

Things like the bolded / shaded top. Is this a Delphi switch, something
only available in a version beyond etc. I don't know exactly what is
available to me to tweak my application, and I was hoping there was a
'Correct form design for Delphi' blog or read around - but I guess there
isn't.

In some ways I don't know really what I'm asking for. I know I want the
end result (a pleasing layout and colors on my forms - making them easy
to use) - but I don't know how to get there.

I feel like what I need is a cross between a developer and a graphic
designer. Just wanting to know how to create the right colors, or which
color combinations are a bad choice, and also how to lay components out
correctly.

The forms I have will have a lot of fields on them. I figure that group
boxes may be best to segregate different areas of the form to make it
easier to navigate or understand, but once again - I can throw a whole
lot of group boxes on the forms, but for some reason they never look as
nice as some of the demo programs I see.

(Not just the look, but moreso the layout. Searching the web I've found
that I should be using the snap to grids for alignment, and that I
should leave a couple of pixels between components for scaling. Basic
stuff I guess - but this is stuff I've never been taught, so I'm trying
to go back to the basics to learn what is pleasing.

I've also found out that there is a natural golden ratio (which is used
for light switches, etc) which is more pleasing than a square, and
apparently used by nature as well. Maybe I should be looking at trying
to implement this ratio within my forms as well...

> Best way I've found over the years is rough it out and ask the poor soul who's going to spend his life in front of it. I've also found that most users need a physical interactive example to play with. Its why RAD should be so good (often isn't) since it allows you to get something in front of them quickly.

I've got no issues with feedback - but in this instance the end users
will be (hopefully) many different people - it's not a dedicated app for
one business...

> Errm websites, developers. Remember the people who produce websites are developers, just with a different toolset, and often mindset.

Whoops - I almost started a flame war there. Smile

> OR develop your own style and apply it. Simpler & sparse is generally better. One thing I would recommend is not to follow the MS rollercoaster of look & feel. I don't think they're making many friends these days.

I'm definitely not following the Microsoft rollercoaster. I agree with
you. Users I've experienced are very upset with the constant changes -
and interfaces. So am I. I want something basic but effective, and
pleasing to the eye.

Thanks for your help and advise.

Cheers

Adam
Thu, Nov 5 2015 5:47 PMPermanent Link

Adam H.

Hi Tim,

Thanks for your reply..

> The key question to start with is this:  are you targeting Windows 8 and higher ?  And, if so, do you want your application to have a more "Metro" look to it ?  The UI guidelines have changed a bit between Windows 7 and 8, although not as much for desktop applications.

Definitely not when it comes to the Metro look and feel. I'm wanting a
more desktop look, and something more at home on Windows 7 than anything
else. (Happy to use on Windows 8 and 10, but most people I've come in
contact with are much happier with standard desktop applications than
fancy metro apps).

> Another question is: do you want to stick with the VCL and standard Windows controls, or do you want to do something more adventurous such as FireMonkey ?

VCL at this point in time. I have DevEx components which can look nice -
but as I mentioned to Roy - it's one thing to have the tools, it's
another thing to know how to use them effectively. Wink

Cheers

Adam.
Fri, Nov 6 2015 2:34 AMPermanent Link

Roy Lambert

NLH Associates

Team Elevate Team Elevate

Adam

>I do have devex components. Athough I know it's one thing to have the
>tools - it's another to know how to use them correctly. Smile

and another different thing to use them aesthetically Smiley

>In some ways I don't know really what I'm asking for. I know I want the
>end result (a pleasing layout and colors on my forms - making them easy
>to use) - but I don't know how to get there.

I can help with the easy to use - give the program to a user, stir for 10 years - he/she will think its the easiest thing on the planet to use Smile

The other way is not to hide stuff (do you know how many people don't know about right click menus?), make it "click at random" and "click lots more times because it hasn't done anything" proof

>I feel like what I need is a cross between a developer and a graphic
>designer. Just wanting to know how to create the right colors, or which
>color combinations are a bad choice, and also how to lay components out
>correctly.

Problem with graphic designers is that they get carried away - remember the fad for weird shaped applications. Another problem is one person's colour sense is not the same as his mates.

I've started a thread in the binaries and attached a screenshot of one of my apps (my main business app - I sit in front of it most of the day)

>The forms I have will have a lot of fields on them. I figure that group
>boxes may be best to segregate different areas of the form to make it
>easier to navigate or understand, but once again - I can throw a whole
>lot of group boxes on the forms, but for some reason they never look as
>nice as some of the demo programs I see.

I tend to use my homebrew page control a lot. It helps to stop any one form getting to busy but lets people easily navigate / see what's there

>(Not just the look, but moreso the layout. Searching the web I've found
>that I should be using the snap to grids for alignment, and that I
>should leave a couple of pixels between components for scaling. Basic
>stuff I guess - but this is stuff I've never been taught, so I'm trying
>to go back to the basics to learn what is pleasing.

Scaling is a bit of a nightmare. Yonks ago I bought ElasticForm and have migrated it along with me. I have yet to find its equivalent out there which is a shame because its no longer supported and its brilliant.

>I've also found out that there is a natural golden ratio (which is used
>for light switches, etc) which is more pleasing than a square, and
>apparently used by nature as well. Maybe I should be looking at trying
>to implement this ratio within my forms as well...

Now you're starting to freak me out Smiley

I know about this but I think its along with whay we find green & blue nice colours - we've spent lots of time evolving with them in front of our eyes. Trying to force the golden ration is more likely to result in something which doesn't look good. On the other hand something which does look good may well have that ration "by accident"

>> Best way I've found over the years is rough it out and ask the poor soul who's going to spend his life in front of it. I've also found that most users need a physical interactive example to play with. Its why RAD should be so good (often isn't) since it allows you to get something in front of them quickly.
>
>I've got no issues with feedback - but in this instance the end users
>will be (hopefully) many different people - it's not a dedicated app for
>one business...

So - consensus is a good thing - get feedback early and often - even if its just the missus.

Roy Lambert

Fri, Nov 6 2015 2:59 PMPermanent Link

Tim Young [Elevate Software]

Elevate Software, Inc.

Avatar

Email timyoung@elevatesoft.com

Adam,

<< Definitely not when it comes to the Metro look and feel. I'm wanting a more desktop look, and something more at home on Windows 7 than anything else. (Happy to use on Windows 8 and 10, but most people I've come in
contact with are much happier with standard desktop applications than fancy metro apps). >>

If you want something that looks good on Windows 7, 8, and 10, then you're going to want to stick to the normal themed Windows-based controls because they're going to be the most adaptable on each version of Windows (and older versions).  Having something like the DevExpress components is also going to help a lot.

Apart from that, things start to depend upon your users, to some degree.  For example, I personally *hate* the ribbon interface - it's way too much of a jumbled mess to me.  But, some developers/users love it.  The main point here is that you'll have to tailor your UI control usage to your target audience.  If you're doing a POS (point of sale, not the other thing) application, then you will try to limit mouse usage, etc.

My main recommendation would be what I try (note the use of "try") to do with EWB's interface (and the utility interfaces for EDB/DBISAM):  if your functionality is even somewhat complex, then the UI's job should be to make that complexity seem simple and should try to do as much to handle the complexity "behind the scenes".  A user should be able to sit down and start using your application without knowing a lot about it ahead of time.  Don't overwhelm the user with options, and guard your UI from encroachment by user requests for "adding an option here, or adding an option there" as much as possible.  If power users need different options, then put them away in a dialog somewhere or make those users edit configuration/settings files directly to affect these custom behaviors.  This is why open source software is often a jumbled mess.  There's nobody acting as a gatekeeper and every developer's whim/desire is just plopped right on to the main work area of the application, even if it doesn't belong there *for most users*.  Alternatively, you could even have multiple interfaces ala WinZip, with one for basic usage (the default) and one for advanced users.

After that, my next recommendation would be to watch your spacing and layout.  This is a lot easier when you follow my main recommendation. Smile Margins should be consistent, and you should use the layout capabilities in the VCL (Align property) to allow your application's controls to adapt nicely to changes in the parent container sizing.

Tim Young
Elevate Software
www.elevatesoft.com
Fri, Nov 6 2015 6:45 PMPermanent Link

Adam H.

Hi Roy,

Thanks for providing the screenshot. It's always good to get ideas of
what others are doing.

> I can help with the easy to use - give the program to a user, stir for 10 years - he/she will think its the easiest thing on the planet to use Smile

There is much truth to that! I think my applications are simple enough
to navigate. (Feedback from new users tells me that). So the simple side
of things I think I've got covered - it's more the look...

> The other way is not to hide stuff (do you know how many people don't know about right click menus?), make it "click at random" and "click lots more times because it hasn't done anything" proof

I tend to 'hide' things for more advanced controls that only certain
users (who are more tech savy) should have access to in the first place. Smile

> Scaling is a bit of a nightmare. Yonks ago I bought ElasticForm and have migrated it along with me. I have yet to find its equivalent out there which is a shame because its no longer supported and its brilliant.

I still use it myself. As you say - nothing has come remotely close to
it. I'm even more surprised these days - since there are more devices
with different screen resolutions than ever before.

>> I've also found out that there is a natural golden ratio (which is used
>> for light switches, etc) which is more pleasing than a square, and
>> apparently used by nature as well. Maybe I should be looking at trying
>> to implement this ratio within my forms as well...
>
> Now you're starting to freak me out Smiley
>
> I know about this but I think its along with whay we find green & blue nice colours - we've spent lots of time evolving with them in front of our eyes. Trying to force the golden ration is more likely to result in something which doesn't look good. On the other hand something which does look good may well have that ration "by accident"

Possibly. This is where I'd love to see someone who really knows there
stuff do up a blog. (Heck - maybe it's a good opportunity for someone
looking for an idea for their thesis Wink

> So - consensus is a good thing - get feedback early and often - even if its just the missus.

Hmm.. I get enough feedback from her already on everything else. <vbg>

Maybe I just need to look at tones of different applications to get an
idea of the look and feel that I like - google application screenshot. Smile

Have a great weekend mate, and thanks again for the chat!

Adam.
Fri, Nov 6 2015 6:50 PMPermanent Link

Adam H.

Hi Tim,

You and I have the same idea. I hate the ribbon controls. I notice that
they work (after much time and pain) for some applications such as MS
Word - but that's because people end up knowing how to use them in that
application.

I figure that if they were used in everything - people would find it
much harder to learn - unlike standard menu's which seem to be similar
regardless of the application (or operating system for that matter)...

I've used elasticform with my previous applications -and it's served me
well. I know it's not a standard way of doing things (and is frowned
upon by a number of developers) - but the feedback I've had from my
clients is the contrary.

I like your tip about not whacking every request on the form. I tend to
do that already (hide more advanced options - or at least not hide, but
not have them directly available) to keep the main functions as simple
as possible.

Thanks again for the feedback... have a great weekend!

Adam
Previous PagePage 2 of 3Next Page
Jump to Page:  1 2 3
Image