Need help redesigning ReCom layout

[luke]

Hi all,

ReCom anchors just had an online meeting last Sunday and one of the topics discussed is the renovation of ReCom's layout and front page. Some of the decisions made include:

1) removal of Forum's Recent Discussions from ReCom front page.
2) excerpts from ReMag will be put where Forum recent discussion is now. For each excerpt, there will be a link to the corresponding forum discussion.
3) moving the sidebar from right-hand side to left-hand side. ReCom navigation bar will be then moved to the sidebar for easier utilization

for that reason, we need some help in designing the new layout for ReCom (the whole page, not just banner). Here is a sketch by thirdshifter on how the new layout should look like roughly ..

http://pages.cthome.net/mudasir/lay%20out.JPG</img>

please .. if you have the skill, please try to help .. if you don't like ReCom's current layout, this is the chance to improve it ..

thanks in advance.

[digimushu]

If you don't mind, can we keep the recent discussions layout the way it is now? You can move it to another page(yes, remag needs to be lil bit more highly publicized on the page). Coz its always thru the recent discussions page that i know what is going on in M'sia.

just an opinion
:)

[Thirdshifter]

The current Forum's Recent Discussions would still be on the front page but will be under the articles and with a slighty modified look and the way it would work.

Basically we need Help designing and debugging the website. If your interested please let Luke know.

[masterof_none]

Thanks Luke,THird and Digimushu.

Yes, we would love the welcome anyone who want to be part of our Web Team. anyone interested in designing the Next Recom layout can Email Luke at anatilmizun@<hidden> or me at hasran@<hidden>

And we certainly will keep the Recent discussion at the front page. :)

Thanks.

[endoru]

Hi everyone in the team !

Well, I'm Endoru, and I am new around and I have not been to every single corner of ReCom but I am interested in helping with the renovation. I reckon that I have enough skills in helping with the programming area. I only do know simple HTML and JavaScipt but not PHP and others. A bit of Perl and CGI though, but my knowledge of it is at a very low percent.

I do not mind helping in the area of designing for I know how to use basic functions of Fireworks (Macromedia). So, I am not sure what I can help in. But, if you guys need a helping hand, I' ll try my best because I want to learn more about web-designing myself too.

Peace !

[luke]

thanks endoru! yup, we definitely need someone who can design using any graphic program .. don't worry about php and stuff, I can take that over .. thanks, endoru!

[endoru]

Hi Luke

Yeah, I am glad to be part of the team even just being a tiny part of it. Do contact me whenever you guys need the help.

Peace !

[luke]

at the time being, we need someone to design recom's front page like what illustrated in thirdshifter's sketch ... create the banner using photoshop/firework, make the boxes/containers for the menu, poll etc etc ... basically, you start from a blank page and work up until you can fit recom's page contents into the layout .. theme and color choices are up to you but preferably use some 'bluish' color as the main color .. no need to be so complex and cool looking ... just a little clean-looking layout will do ...

again, thanks! you will definitely be a great help to recom!

[masterof_none]

Thanks Endoru, welcome to the ReCom WebTeam!. :).
Luke is ReCom's expert in the WebTeam. Let's work together.

[weich]

don't mind helping since I'm also doing Internship ASIA's website...just give me a task list...and hopefully, my skills are acceptable =)

....but issit still based on PhpNUke?

[luke]

thanks weich .. for now we need to redesign the whole recom's layout .. i.e start with a blank page, create a banner to put on the top, then design a box for menu, design the content area like if you want to content to be boxed .. refer to thirdshifter's sketch for the rough idea ... themes and color choices are up to you but preferably use a bluish color set ...

yes, we are still going to use phpNuke but don't worry about the scripting part .. once we have decided on a layout, I'll integrate the phpNuke codes ..

[luke]

ok ... here is an example of layout for ReCom I just made ...

http://anatilmizun.homeip.net/recomlayout/

and here is the Photoshop file for ReCom's current banner in case you want to use it ..

http://anatilmizun.homeip.net/recomlayout/banner.psd

anyone with a browser other than IE and Mozilla please check if the CSS works well in that layout ..

[Thirdshifter]

Luke,

I like what i see so far just that i dont think The front page has to have the indexing thing you did. Although very nice it's redundant since it would be in the Side MEnu bar as well.

I think it would be better if the background is white. It looks more cleaner and easy on the eyes.

[luke]

that's just an example .. I'm designing this layout for my friend for his research project ... I just took a little time to decorate it with recom's banner just for demonstration .. to inspire others to start designing ... I'm not planning to use it if *someone* can come with a better layout ... anyway thanks for the comment ..

EDIT: just curious .. what do you mean by "indexing"? is it the tabs on the top of the content area?

[masterof_none]

I might miss this point, but I love the right-hand bar. (hint: remag).
I'm still not sure why majority of the bar is designed to be on the left, where most of us are 'righties'.
Other than that, it's great.

[luke]

I don't think left- or right-handedness affects layout preferences ... you might use your mouse with your left or right hand but once your hand movement is translated into pointer movement, which hand you use becomes irrelevant ...

instead of making relation between hand affinity and visual layout, let's consider the fact that english/malay (or any languages that use roman alphabet writing) use left-to-right (LTR) writing system ... when reading a text in these languages, your eyes scan from left to right, and everytime you reach the end of a line, you go down and start from the leftmost letter of the next line ... this is the usual way LTR writings are read .. whenever we encounter a text, we will immediately look at the leftmost part, where a text usually begins .. inadvertently, this affects the way we look at textual things (books, websites etc) ... we tend to look at the left-hand side first, then our eyes scan the whole plane space until they reach to the far rightmost part ... thus, to take advantage of this, it's better for a website to have navigation menus on the lefthand side compared to on righthand side ...

[weich]

ok, did a couple of designs for the banner:

any suggestions/comments welcomed =)

1st design but in orange:

http://img.photobucket.com/albums/v260/wczeusu/recom1.jpg

Now in blue, but slightly different:

http://img.photobucket.com/albums/v260/wczeusu/recom2.jpg

Different design:

http://img.photobucket.com/albums/v260/wczeusu/recom3.jpg

Without the chunk of words:

http://img.photobucket.com/albums/v260/wczeusu/recom4.jpg

[Thirdshifter]

The Simple. orange and blue one looks good to me.

[topdog]

i personally feel that every website should be like google's.minimalist is best:D yeah i like the orange and blue banners. whatever you do, may i humbly suggest that you ditch the "recom stands for...." thing? it's so long it's almost like a karangan.

[luke]

they look great, weich! my pick is the one with blue orb ...

next, how about designing the placeholder for menu? :)

[weich]

hmm..any guidelines? like size, how many links, etc? :D

[luke]

the placeholder will be on the lefthand side just below the banner and should not be wider than 160 pixels but of course it should be wide enough to fit the menu items .. I think it should at least can fit the "Recommend Us" string in it ..

the number of menu items is to be determined later .. it's better to make the placeholder vertically-expandible .. and it doesn't have to be constructed using image files ... using <div> and CSS is enough ...

[chenchow]

Just a suggestion that if we use the orange or blue ball, may be a way would be to have a sort of bit of world map (including malaysia) on its background... not sure whether it is possible, just a random thought.

Hope more ReComers could come in and give comments on all these designs.

Thanks weich for the design.

[Schye]

How about making the sphere a gloge with those grid lines on it ?

[endoru]

DESIGNING STARTING ALREADY ?!?!

Somebody must tell me lar.
Urm ... I will do something and ask you guys lar.
Hehe.
Peace !

[masterof_none]

weich, great work. I like the banners. (I like the bottom one).

endoru, thanks for your interest!. you can contact luke for more info about the design at anatilmizun@<hidden> / anatilmizun@<hidden> or me , masterof_none@<hidden>.


thank you. !. Great work guys!.

[pandaboy]

Wow...great banner designs. I prefer the last three....the colors are easy on the eyes... The first one a bit glaring...

Are the banners gonna be permanent? I think it's good to change the banner once in a while... :wink:

[weich]

hmm...not too sure if i can fit the globe into the sphere...anyway will try =)

btw, anyone else interested in editing/improving my designs....PM me with your email address so I can send you the psd files.

Cheers =)

[chenchow]

good...it seems that we have a number of designs coming up...it won't be permanent...may be we can make it a change every month? every 2 months? every 3 months? depending on how many ReComers who are interested in designing... the more designers that we have, the more frequent we can change the design... So those with artistic skills...please start designing~!

[endoru]

WOWEE !
I liked what you said Chen Chow.
Urm.
Artistic skills ?
That boiled my blood up a bit and I guess I shall do something over the summer holidays.
Wait for my designs ...
Haha.
Anyway, mail Luke or Master of None ?
To get more info ?

mail me : soh_chih_jen@<hidden>
I need more info to design.

This is fun.
Major fun.
Peace !

PS. NICE DESIGNS ABOVE !
Love the one with words.
I am more of the one who prefer complexity than simplicity.
So is the theme like ORANGE and BLUE ?

[chenchow]

Endoru, nice spirit~! Contact Luke directly. He is in charge, but contact masterof_none is fine too... masterof_none is ReCom's founder~!

I think basically the color choice etc, is up to the designers... basically, it would be for ReCom - The Worldwide Malaysian Students Network... So, any color, theme that works fine for this setting, it works...

Hope other ReComers can come in and share your opinion...eventually these banners are going to be seen by you guys every time you log in ReCom...hehehe

[screw3d]

Ah well. I would love to help out now but I'm tied up with a bunch of other projects.

Here's a suggestion, instead of deciding between blue and orange, just use both. All you need is two different stylesheets and you can have a button somewhere that enables the users to choose their own theme.

BTW I think it's high time that recom embraces web standards and focus the user interface on accessibility :) The last time I checked, recom came up with more than 700 errors on the w3c validator! 8O I understand that lot of these errors are from phpnuke/phpbb but still :)

It won't be easy, but I'll gladly answer any questions!