User-centered design (UCD) is an approach for employing usability. It is a structured product development methodology that involves users throughout all stages of Web site development, in order to create a Web site that meets users’ needs. This approach considers an organization’s business objectives and the user’s needs, limitations, and preferences.

Importance of User-Centered Design

In order for your Web site to be successful, users must visit the site to find information or accomplish tasks. No matter what objectives you have set for your Web site, it must carefully balance the needs of users and the needs of your organization. If users don’t find your Web site helpful, they will not use it.

From the business side, you can lower operating and redevelopment costs by developing a product, such as a Web site, correctly the first time around.

The Process

To create a user-centered Web site you must think about the needs of your users throughout each step in the development of your site, including:

• planning your site
• collecting data from users
• developing prototypes
• writing content
• conducting usability testing with users

Creating a User-Centric Web site

The first step is to clearly define your organization and users’ needs, goals, and objectives. To get the project started, begin by asking yourself (and your Web development team) more detailed questions such as:

• What are your agency’s primary business objectives and how do they relate to the Web?
• Who are the users of your Web site and what are their tasks and goals?
• What information and functions do your users need, and in what form do they need it?
• How do users think your Web site should work and what are their experience levels with the Web site?
• What hardware and software will the majority of your users use to access your site?

Download link: Architect_theme_by_Hyena_Labs

Dashboard – a dashboard is a user interface that, somewhat resembling an automobile’s dashboard, organizes and presents information in a way that is easy to read.

Intuitive Dashboard Characteristically

Synergistic : Must be ergonomically and visually effective for a user to synergize information about different aspects in a single screen view.

Monitor KPIs: Must display critical KPI for the business to which the dashboard is representative.

Accurate: The information displayed should be timely accurate avoiding any confusion in the information. The dashboard should be tested & validated.

Responsive: It should be responsive through threshold triggers & user alerts via visual presentation on the dashboard.

Timely: The dashboard must display most timely information possibly for effective decision making.

Recommendations

The reporting solution should follow some of the standards that are quite popular with web 2.0 users. I have listed them here.

to be synergistic

• The dashboard display media should be mature as per the current industry trends.
• The presentation to the user should be flexible & should meet user needs.
• Use of commonly used symbols, conventions, colors and organization needs emphasis.
• Customization of views based on different user profiles is recommended.

for Monitor KPI’s

• KPI & KRA needs to be aligned with the project progress reports
• Effective color usage for KPI/KRA monitoring is suggested.
• Effective filtering of information/reports with options to save filters is of utmost importance
• Display data based on user profile i.e. trends, actual data or percentage

for Accuracy

• Drill down capability with an overview of reports should be incorporated
• Distribution via e-mail embedding & attachment is recommended.
• Present the data in user’s context. If he is the IG head display the projects that he is monitoring not any other projects.

for Responsiveness

• Provide alerts & notifications based on business rules for action to be taken
• Avoid multi step process for completion of user tasks.
• The Information architecture & navigation should cater to the user needs.
• Creation of a rule engine which helps in monitoring of business intelligence with provision to adapt is important.

Timely

• The mangers should be able to enter data on a regular basis to add to the freshness of information.
• Display time stamps, titles & labels on each display media based on its correlation.
• System guided response for the users. Notify the users to take an action based on the business context.

The existing system was primitive in reporting

Design by Hyena Labs Studio for one of the clients

Dashboard - Crystal reporting

The data feeding section is accessible via tabs & Dashboard is the landing page.

Data entry sections - via tab

]]> http://www.hyenalabs.com/2011/08/12/dashboard-design-by-hyena-labs-studio/feed/ 1 http://www.hyenalabs.com/2011/08/01/hello-world/ http://www.hyenalabs.com/2011/08/01/hello-world/#comments Mon, 01 Aug 2011 16:36:16 +0000 admin http://www.hyenalabs.com/?p=1 Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!

Pligg CMS 1.0.1 Installation Tutorial from Eric on Vimeo.

Tutorial

1. Download and install WAMP or Xamp. If you are a Mac user you can use MAMP.
2. Restart your computer
3. Download Pligg CMS and move the Pligg files into a subfolder. In this example we will use the /pligg directory.
4. Create a new MySQL database from http://localhost/phpmyadmin/
5. Run through the Pligg readme.html file (http://localhost/pligg/readme.html) and rename the necessary files mentioned in it.
6. Navigate to http://localhost/pligg/install/install.php to begin the installation process
7. Run the installer using the MySQL database you recently created. The default WAMP username is “root” and the password is blank.
8. Create an admin user and you’re finished!

Well you have this option, have a look at the video.

Go to this website for more details. Click here

The travel begins

I was in NY and the company gave me a good place to stay, it was Candle wood Suites, well i liked the place.

I stayed here in New York

UMG office is a great place to work, i really liked the office space, all things were so big.

Business Challenge

Oops there arose a business challenge, and we had less time for the release, so what i proposed to just go for an Expert User Interface evaluation. The results was welcomed by the stakeholders.

Have a look at few screens that was looking so live on the big projector screens.

Landing page evaluation

Use of the usability report – i discussed the presentation with the stakeholders and it was a boom boom ride, i was explaining why i am giving the suggestions to change the sections. A great value was given to my words and i really liked it.

Player evaluation

There used to be stand up meetings everyday, and the development team used to come and we used to track the bugs in Jira.

Play bar evaluation

The metric that really matters is the below one, this gave us a view how good or bad the design is. The stakeholders loved this and they had a smile on their face when they saw this graph. We can really use the numbers wisely and plan our next release goals. Overall this work is a life time memory, hope to again land in NY for a business trip soon.

If any of you clients, business people are looking for me to come there please let me know, do send an e-mail to

sanjay.kuamr.ux@gmail.com

Surprise me, i love surprises.

The style guide was used to understand the branding and the font size that should go in the design.

First version to test the water

The feedback we received on the first version was.

• The design needs to be lighter
• Include the EULA in the window
• Add the version of the software

These things came up when the first version of the design was send for review, we send the first version to test the waters. Bang we got it right.

We impressed by being creative

Second version became the final version. We made the design look cleaner and lighter.

The comments we got were

” That’s perfect, I’ll use this design. Thanks.”

Solution: Take a new layer, make a box and move this layer just above the background layer. Use black color to fill the box, and change the opacity to 10%. Now cut the center area, where you want the section to be white.