New Homepage design

[hek]

When designing the new site, there were a few things I had to consider. leading up to how it looks today.

1. For newcomers (coming directly to the forum from some google search) should have the main sites menu at the top (so they could seek information themselves more easily)... and the top menu should be as minimal as possible (not wasting valuable space)... And I couldn't mess too much with the forums build in menu.

2. Main site: We needed some kind of scrollable left menu that could hold a growing number of sub articles. With enough horizontal space to give proper titles. So I had to switch to a bootstrap fluid container (which behaves a bit differently but gives full page width).

3. Moving between forum <-> main site should feel natural. Which meant switching to the fluid design here as well.

[cimba007]

@Anticimex

You just made a point .. ever wondered why books are not printed in landscape? Because moving the eys from the right most side to the left most sides is a hassle and stressfull.

@hek

Point 1: I really like the idea of having the forum and main site menu united.

Now the important stuff is also split. Categories, unread .. and most popular on the left .. search and notifications on the right .. why not move all to the same side?

Point 2: I like the left menu. Nothing to comlain here.

Point 3:

Switching between the "starting page" and the "forum" now looks like a mayor break in the design flow

PS: The main page design is much more flexible with different sizes. If the monitor is smaller .. just take from the free space (left and right) .. if the monitor is bigger .. well .. some more free space .. nice.

But with the forum it is totally different. Pinning the content to the left and right space gives a different user experience depening on your resolution.

[Anticimex]

@cimba007 I tilt my screen when I read documents. Just like a book. So yes, I agree with you. And regarding the left hand menu, you like it because it is not squeezed. This is what it used to look like:

[cimba007]

So why not leave it and maybe add another 5-10% more space?

Or .. if you are in the mood to experiemnt .. why not add the menu to the right? This would allow it to take as much of the free space it needs.

To make this clear .. I am not saying "the new design is bad because .. reasons" .. I can only report my impression of as a user of a "big" screen (24" @ 1920x1080) and can say it feels awkwars when the content is split all over the screen .. having to constantly move my eyes over a large distance as the "relevant" and "important" functions are now split more then nessesary.

[Anticimex]

@cimba007 @hek fine by me. I take issue with a width that forces line breaking of menu entries when not required by physical limitations. And the old design did. Hence my complaint that it was too narrow for comfort.
And since I presume you use a mac (with its ridiculous window manager) let's meet in the middle, widening the design enough to accommodate reasonable long article titles for the left hand menu without line breaking while permitting people that for various reasons don't want or can't tilt the display nor resize the browser.

[cimba007]

I like your idea ;-) and I totally agree that breaking lines when there is enough space is not a good design.

And .. I would never ever use a mac ;-)

And you are right .. I can't tilt my screen and I am not willing to change my browser size for one tab out of ~25.

Even if it might be obvious .. if the title is too long to fit the layout .. maybe choose a shorter, more concisely title ;-)

[hek]

A few % side-padding here on the forum wouldn't hurt.

I'll see what I can do with the forum menu with a simple css hack (as I would like to keep away from doing my own theme).

[Anticimex]

@cimba007 as you can see from my picture, judging by your standards "advanced build options" would then be a too long title, and if that is the case, we would need to provide an on screen legend to explain all the abbreviations we would have to use just to keep the menu "sane". And then we are into really bad page design ;)

[hek]

Regarding menu.. Is this better?

[Anticimex]

@hek not sure, menu for me is the main site vertical list of topics. The forum layout I don't really mind as I can zoom the page to make it more appealing to me even if you revert back to the old layout. But in the main site, zooming would not help as the contents was forced to adapt to the layout.

[cimba007]

Yeah .. "advanced build options" should in every case fit there :dancer:

@hek: If this is your "real" screen size I can totally understand why this is no issue for you at all :D
It looks a "little bit" packed but still much more accessible then splitting. I want to search? Top right corner .. I want to read the most recent message? Top right .. wanne check download area? Guess what ..

[hek]

I could add some padding between the two lower sections.. just a sec, lets try it.

[hek]

5% padding added (not sure how much it helps on your screen though) and moved menu to the right.

[cimba007]

I would be more happy with 10-15% but I think I can live with it. Would be even more awesome if this could be set as a "preference" on a per user basis .. but this would be too much to ask :)

PS: Can u tell me where you have added the padding? (in the css file?!)

[hek]

10% och each side is way too much on smaller screens.

You'll have to greasemonkey in your padding changes on the #content div.

Or simply remove the width: 100% !important on it to get the old behaviour back (but that also affects the menu... which might not a problem for your screen size).

[cimba007]

@hek said:

#content div

Yep .. I am just heading for greasemonkey

[cimba007]

This is just "balm for the eyes" .. I can absolutelty life with tinkering with greasemoneky ;-)

[hek]

Haha, have fun redesigning sites ;)

[Anticimex]

@cimba007 @hek and it was much rejoicing

[cimba007]

Sorry for stirring up so you guys at this late hour .. but .. I only strive to improve mysensors (with my stupid comments and ideas :D) as I really like the library, the controller, the site ;-)