Alex H's pages - projects - homepage V2
Prettifying UPSU's pixellated front door. Or something...
About this project
The original UPSU homepage was designed using a table-based layout. It needed to provide good cross-browser consistency, load (reasonably) quickly, and, most importantly, provide an effective snap-shot of the UPSU.net content to first-time and repeat visitors alike. That version of the homepage was designed and implemented with the first launch of the UPSU.net/Mambo website in August-October 2005.
Since then, we have encouraged feedback on how we can go about making the homepage more attractive, functional and accessible. I'm hoping that the second major revision (referred to as "V2" 'cos I'm bored...) of the homepage will meet or exceed the expectations of most people. Here's how...
More design specs
Since then, we have encouraged feedback on how we can go about making the homepage more attractive, functional and accessible. I'm hoping that the second major revision (referred to as "V2" 'cos I'm bored...) of the homepage will meet or exceed the expectations of most people. Here's how...
- Faster: it will use a pure CSS-based design wherever possible.
Naturally there might be a good reason to add in a table to display some types of content, but on the whole I think we can remove tables, allowing us to switch to comparatively faster-loading, more up-to-date designs based on CSS alone. If you have no idea what CSS is, but are interested in finding out, try reading this article on WikiPedia, or take a look at CSS Zen Garden to find out more. - More information: it will provide a better balance of content.
Some important areas of information were missing from the old homepage design - forums and galleries in the "member-generated content" areas, and more emphasis on providing ways of highlighting current campaigns - for example through the provision of extra advertising spaces for internal promotion. I don't want to load the page up with hundreds of flashy, distracting images though, so the balancing act here is to find ways of positioning "hot" content without unfairly drawing attention from the regular guests on the homepage. - Familiar: the existing wireframe won't be completely wiped out.
The current homepage is based on a "wire-frame" model, where certain types of content will be consistently displayed in certain positions. The most prominent example is the 450x200 pixel "hero" advert on the top-right of the page. The new design will retain the majority of the current design's wireframe, but better use of the space on the left and towards the bottom of the page will be made. At least, that's the plan - it could all go horribly wrong yet... - Colourise it: you'll be able to make it more "your own".
I know it's only a little thing, but you will (maybe eventually) be able to select your own choice of primary colours for the homepage, with a default of either purple or orange. Or something... Colour settings will only be available to signed-in members, and will be stored in the user's profile. This could pave the way for further customisation of the homepage later in the year, with members being able to add their own bookmarks and RSS feeds to their versions of the homepages, and possibly even a UoP e-mail inbox checker, although that will depend largely on whether ISO can work with us. - It'll be prettier.
A totally superficial design goal, but my favourite. So there.
More design specs
Project diary
"Dear diary..."
24/09/2006
Playing catch-up here as I'm writing this retrospectively, but so far, I've...
Things yet to be done...
Thought for the day. Or something....: I may grumble, whinge and complain about this site, but it's so much easier to work with a single, database-driven site than having to worry about pulling information in from several different sites - one major reason why I'm glad we aren't (at this moment) looking at divorcing the UPEL content from the UPSU site, although it has been mentioned a few times now.
Bedtime...
24/09/2006
Playing catch-up here as I'm writing this retrospectively, but so far, I've...
- Picked out the content list for the homepage (bold means it's new):
- Hero feature
- Sign-in and search boxes
- Single-line news flash for important information
- A thinner "Jump in" column of links to replace the static "Browse" box, making space for...
- The "Sabb watch" and "UPSU Recommends" column to the right of the "Jump in" column, containing the Sabbs' latest blog entries and static, graphically-orientated links to highlights of UPSU's content (The "Recommended" content replaces the "Don't miss" and "You might also be interested in..." static boxes which are currently at the bottom of the homepage).
- A revised News column, with much more space available for news from all areas of the site.
- A revised Social Life column, with the Social Life diary and latest galleries.
- A listing of the latest forum posts.
- ... What have I missed?
- Reviewed our implementation of the common "header" bar (the purple links bar with the fly-out menu) - we'll lose the grey bar that lives underneath it as all the functions that bar does will already exist elsewhere on the homepage in prominent positions (i.e. sign-in and profile links). This meant creating a second version of the header bar file, which will also be used as a prototype to switch over to a CSS-based header bar at a later date.
- Worked out how the homepage will change over time (the current version - version 1 - changes colour each day of the week). The new version will be a colour of the member's choosing (i.e. you have to sign in to change and save your homepage colour), and will vary from a light version of that colour with a white background during daylight hours to a dark version of the colours with a black background at night.
- Reviewed our existing homepage files - one php file was carrying out several distinct functions (404 page, Upsuuuuugle, and homepage). This has now been split down into several "included" files, which also means we can build the new homepage in parallel to the existing page and simply transfer over to the new design by changing one line of code, instead of furiously hacking the site around in a panicked hour of swearing profusely while hoping no-one spots the homepage has gone horribly wrong... Sorry, drifted off into a worst-case scenario mentality there...
- Designed the graphics - very stripey.
- Started threading the new static graphics, CSS, and existing dynamic content together.
Things yet to be done...
- Now I know the vague details of the new homepage content, I have to decide when and how I'm going to start turning off the old homepage "includes" (which are configured in the site's back-end control panel) and start turning on the new content. At the moment, I'll probably keep the old content alive as late as possible to minimise disruption.
- Work out how I'm going to pull in the latest galleries information without breaking the module-based system used on the site. I'll probably have to write a custom code module to handle this function.
- The same goes for the "Sabb watch" module, which selects blog entries from users based on a setting in the member's account profile (which can only be changed by site admins).
- Re-specify how the news information is going to be displayed. This might require the creation of a new code module to display news content in a CSS-friendly way. Problem is, the current system is a fairly complex chunk of code with image resizing code built in, so hopefully I'll be able to reuse the existing system.
- Re-design the output from the Social:Life diary listing - the existing layout will be too wide for the new design, and in any case it won't fit with the new page design.
- Design the styling and surrounding images for the footer links.
- Assess whether we are going to continue to offer accesskey support on the site - a very experienced friend has advised against it, citing this article as reference.
- Do my final year project proposal (not related, just needs to be done).
- Pass my degree (also unrelated. Also very important...).
Thought for the day. Or something....: I may grumble, whinge and complain about this site, but it's so much easier to work with a single, database-driven site than having to worry about pulling information in from several different sites - one major reason why I'm glad we aren't (at this moment) looking at divorcing the UPEL content from the UPSU site, although it has been mentioned a few times now.
Bedtime...
Project resources
Nothing much to put in here yet. Weblinks to related information might be added one day soon...
On this page...
• About this project
• Project diary
• Project resources
If you find this page strangely interesting, also take a look at my diary, as I'll be writing more in there about the homepage's progress.
• Project diary
• Project resources
If you find this page strangely interesting, also take a look at my diary, as I'll be writing more in there about the homepage's progress.
Last updated: Sun 24th Sep 2006 at 02:10
