Anatomy of a personalized web portal - Part 1

My team is currently working on a personalized portal for a large technology company. We worked on the complete design of the site on top of a proprietary content delivery platform. Although the content delivery is already take care of, a lot of stuff was remaining in terms of designing a personalized portal on this platform. First of all the platform is designed to serve static pages. This posed the first challenge in terms of how different content is delivered to each user. All the optimization in the platform is geared towards serving more statically composed web pages than a personalized content. I will be jotting down some of our design experience and the path we followed for designing this site.

First of all we looked at the different parts of the pages that are being composed. Each page has a common header with very little personalization. Mostly it contains the greeting message and list of different pages the user would create or the page navigation bar. In almost all views this would be constant per user and will not be changed so frequently. Remaining header is constant across the site. We have to consider theme-ing the site though. Next comes the footer. This part is really simple static text. The main component of the page is the middle area where the users add different blocks, gadgets etc. This section is the real personalization. However if we look more into this section we would find that there is even one more level of commonality that can be abstracted. Each of the block has common border with a fixed set of context menu. This also can be taken out of personalization. Lastly the arrangement of these blocks on the page made the layout. It was decided that we will have a fixed set of layouts rather than allowing the user to add any arbitrary number of columns in the page. Most of these layouts are combinations of different column numbers and widths.

As a result of this analysis we short-listed following set of components

1. Header text (Localizable)
2. Greeting message (Localizable)
3. Navigation tab (User defined count and text)
4. Static Footer Text
5. Theme (Mostly images and styles. Not localized)
6. Layout (No. & widths of columns. No localization required)
7. Boxes and context menus (Localizable for titles & menus, titles can be clickable links and a small image/ icon to identify the module)
8. Content modules (As per the independent gadget or content developers choice)

In the next article we will see how this can be taken further and what were the other design considerations.

Technorati Tags: Web site,Portals,Design,Personalization,Content Management Platform