10. Multi windows, overwhelming workflow. – Current design
2nd step
1st step
This workflow uses multi
window approach to let the
user do his job. With multiple
windows the user must switch
back and forth to do various
tasks
11. Multi windows, overwhelming workflow. – Improvised design
Improved version with flyout
windows allowing user to do his
tasks much faster and efficient from
one window.
Progressive disclosure technique
applied.
Its more of a focus task flow than
overwhelming multiple window
approach.
13. Design standards internal site – Current version
This existing version uses the
following –
ColdFusion – Server side
HTML
Table structure
MSQL database
Problem areas on this site –
• Bad Content organization
• Bad backend code with reduced
• Performance of the site.
• Static Search
• Huge list of menu items on the left with
no filters, users are forced to click thru
the main and sub menus, slow navigation
• Low visual appeal
• Changes to the entire site (around 700
pages) at once is not possible because
each page is independently coded.
• Database is not fully utilized.
14. Design standards internal site – WIP version 2.0
This is a newer version of the design
standards website
Base –
XHTML
JQuery
PHP
MSQL
This new site is built on the
technologies mentioned above and
utilizes the CMS like structure in
code to easily change the site at a
later stage.
My work includes the new visual
design, XHTML cross browser
code, JQuery, database connectivity.
15. Design standards internal site – WIP version 2.0
Fig 1: Upgraded navigation
The navigation is built on JQuery.
It is centralized to the whole site.
Any changes that need to be applied
to whole site can be done by editing
the navigation page.
The menu items shows the numbers
of sub items within them.
Fig 2: Search pattern
The user can type into the textbox
and quickly search the navigation. It
will auto suggest results as the user
types in.
The user can click on the result to
reach to the intended page.
16. Design standards internal site – WIP version 2.0
The contact us page uses a full page
to show just two form elements. The
user should leave the current page
and go to the contact us page to
write a mail to the team.
The user has to put his email id and
then the message.
16
17. Design standards internal site – WIP version 2.0
The new improved AJAXED contact is just
a overlay and allows the user to stay on
the current page and quickly type in their
message.
The user can press ESC or click anywhere
on the page to discard this contact
overlay.
18. Design standards internal site – WIP version 2.0
This page allows the user to subscribe to
various sections of the site.
It utilizes the whole screen and a entire
page.
Improvised subscribe page with similar
approach to that of the contact section
in the previous slides.