Blog 3 Website Design – PC Solutions

For blog 3 I will be implementing a website design for PC Solutions, which aims to be a one-stop store for all computer users. PC Solution will provide a wide ranges of computers, computer hardware and software.   

Target Audience:

The target audiences of this website includes:

Home users

• PC gamers – primary audience of high-end gaming computer, software and computer hardware (age group 15 to 30).
• Technical – primary audience of custom build desktops, software, computer hardware and high-end laptops (age group 15 to 40).
• Non-Technical – secondary audience who just want an everyday use computer.

Business users – primary audience of laptops, desktops, tablets and software (age group 23+). 

Small/medium Businesses – primary audience of computer and software packages, servers and business solutions.

Sitemap:

The website will carry out a design that suits both technical and non-technical users, it will be simple and straight forward, all pages of the website will have very similar layout, so that the users will never get confused or lost when they on a different page. There will be a navigation bar positioned under the company logo as well as a side navigation panel indicates what page the user is currently on, in addition, each page will also contain heading label.  

An example that has similar design elements

Blueprint:

The blueprint diagram above illustrates how the users interact with the website. Starting from the home page users are able to navigate to six different product pages from the navigation bar below the company logo, users also have the option to log in to manage their account information or view their shopping cart and orders, as well as, sign up for a new account on any of the pages. The navigation Bar will also be visible on all pages, making navigation around the website very simple for users. 

Wireframes:

Below are the wireframes of the Home, Parts and Search Page of the website, which were implemented in Microsoft Visio.

Home Page

 Parts Page

 Search Results Page

Metadata Matrix and Controlled Vocabulary:

Below are 2 lists of a controlled vocabulary table and a metadata matrix. A controlled vocabulary is a way to insert an interpretive layer of semantics between the term entered by the user and the underlying database to better represent the original intention of the terms of the user.

Vocabulary	Description	Examples	Maintenance
Business	Product Packages for business	Servers, Backup Solutions, Cloud	Moderate
Description	Product description, e.g. technical information of computer parts	PSU 1000W, 3.5GHz, LGA1155	High
Product	The products that pc solution sells	Processor, Video card, Memory	High
Category	The type of products	Desktop, Notebook, Tablet	Moderate
Brand	Product manufacturer	Asus, Apple, Samsung	Low
Servers	Sever systems for business	Asus	Low

Accepted Term	Variant Term(s)
Memory	RAM, SD card, SD ram
Notebook	Laptop
Monitor	TV, Screen, Display
HDD	Hard drive, Hard disk
GPU	Video card, Gfx card
PC	Desktop, Computer
Processor	CPU
PSU	Power Supply

Read More

Labeling and Navigation Systems

The website I have examined is Carsales. The screen capture below shows the layout of the website and the table describing its navigational labels.

Points to be addressed regarding the Carsales website:

1. What labels you did not like and why, and suggest improvements.

Carsales' labeling system between the pages is overall very well presented. However, the location of the labels, in my opinion, are better off below the website banner, simply because it can be easily seen by the user, unlike now where the labels are at the very top of the page in small fonts which can be easily missed for any first time users. On the other hand, carsales do include a very useful feature where when users scroll down the page it does not affect the location of the labels, therefore, it allows easy access. 

2. Whether there were any inconsistencies in the labeling system between the pages (in terms of style, presentation, syntax, granularity, comprehensiveness and audience).

The labeling system, in my opinion, it was consistent. As for the presentation, which I have mentioned above could use some improvements.    

3. Examine at least two other similar or competing web sites.  How similar are the labelling systems?  Is any one site clearly the winner (and if so, why)?

The other two websites I examined that competes with Carsales are Drive and Cars Guide (pictured above). The labeling and navigation system for both Drive and Cars Guide are very similar to Carsales, both in positioning the labels and label names, even the content layout of the three websites are similar if not same. Therefore, there is no clear winner between the three websites.    

     

Read More

Alphabetical Ordering

The second post for this week's blog 2 posts is to sort out a list in alphabetical order and answer few of the questions. 

The original unsorted list is:

• El Paso, Texas
• Saint Nicholas, Belgium
• The Lord of the Rings
• Newark, New Jersey
• XVIIme siècle
• .38 Special
• St. Louis, Missouri
• New York, New York
• 1001 Arabian Nights
• The 1-2-3 of Magic
• Albany, New York
• #!%&: Creating Comic Books
• The Hague, Netherlands
• $35 a Day Through Europe
• H20: The Beauty of Water
• Plzen, Czech Republic

Here is my alphabetical order for the above list:

• #!%&: Creating Comic Books
• $35 a Day Through Europe
• .38 Special
• 1001 Arabian Nights
• The 1-2-3 of Magic
• Albany, New York
• El Paso, Texas
• H20: The Beauty of Water
• The Hague, Netherlands
• The Lord of the Rings
• New York, New York
• Newark, New Jersey
• Plzen, Czech Republic
• St. Louis, Missouri
• Saint Nicholas, Belgium
• XVIIme siècle

List of Questions: 

1. Did you put The Hague under T or H?

I placed "The Hague" under "H" as I excluded "The" from the title.

2. Did you put EI Paso under E or P?

I placed "EI Paso" under "E" as it's a location in Texas, United States, it should be sorted following the ASCII Sort Order Chart. 

3. Which came first in your list, Newark or New York?

"New York" came first in the list, because space come before letters.

4. Does St. Louis come before or after Saint Nicholas?

"St. Louis" came before "Saint Nicholas", because "St" is an abbreviation of "Saint", therefore, L precedes N.

5. How did you handle numbers, punctuation, and special characters?

I followed ASCII Sort Order Chart for this, therefor, punctuation and special characters came before numbers, and then numbers came before letters.

6. Assuming the italicised terms are book titles, what might be a more useful way to organise this list?

The more useful way of organizing this list will be having book titles in a separate list as there are different from city names. 

7. If the cities represent places you’ve visited and the book titles are ones you’ve read, how could chronology be used to order the list in a more meaningful way?

Chronological order refers to a record of events starting with the earliest and following the order in which they occurred. Therefor, I'll be sorting this list by date, like a timeline, which it will show the cities i visited or books I have read according to the date.

Read More

Information Architecture

Information Architect (IA) Roles

An Information Architect gathers requirements, defines the system information features (information specification) , conducts content audits, information research, data architecture, writes tone of voice, defines taxonomy, content strategy, word based marketing strategy and content object model.

In Web design, an information architect helps develop programs and plans. The information architect maps the entire structure of the site and organizes the positioning of pages within sections, developing a functional and intuitive plan to get the user from point A to point B on the path of least resistance.

How do information architects fit into a Web team? 

Information architects should meet with clients to help define a project's scope, as well as plot the path to meet the objective and work with the designers and technologists to develop engaging and intuitive visual interfaces.

It's also important for information architects to work closely with visual designers, helping to maintain the balance between form and function. Design effects architecture as much as architecture effects design. Information architects also bridge architecture with development and work with technologists, database engineers, and HTML coders.

How do architects evaluate or design a site?

Before evaluating an existing site for architectural improvements or designing a new site, it's extremely important to find out who will be using the site, strategic and business goals, key usability principals, technical constraints, and future needs. Perhaps the hardest part of information architecture is to help identify a focus (a necessary component of intuitive form and function). However once the focus has been identified, evaluation or designing is all about anticipated user paths, logical process flows, and determining how to balance efficiency with ease of use.

What do architects create for clients?

If there were a template or system for what information architects need to prepare, no one would need them. While there are certain key deliverables that most projects require, the work is most often determined on a case-by-case basis dependent on scope and function. 

Some of the basic deliverables include:
 

Site Maps: Maps reflect navigation and main content buckets. They are usually constructed to look like flowcharts and show how users navigate from one section to another.

Content Maps: Detailed maps that show what exists on each page and how content on some pages interacts with content on other pages.

Page Schematics: Black and white line drawings or block diagrams to hand off to a visual designer. 

Text-Based Outlines: Sometimes information architects want to show architecture as indented text outlines and lists.

Interactive, Semi-Functional Prototyping: In some cases, information architects are responsible for outlining or story-boarding functional prototypes, and in others they actually build prototypes with HTML, Flash, Director, or PowerPoint.

Below is a short video of explaining why is information architecture important in web design:

Read More

Web 3.0 (The Semantic Web)

Today, I'll be talking about the Web 3.0 - the Semantic Web. So what exactly is Web 3.0 technologies? Web 3.0 is the third generation of the World Wide Web, the two most important features are the Semantic Web and personalisation. Now you may ask, what is Semantic Web? The Semantic Web is a collaborative movement led by the international standards body, the World Wide Web Consortium(W3C), which the main purpose is to driving the evolution of the current Web by enabling users to find, share, and combine information more easily.

User's experience with Web 3.0   

Web 3.0 will provide users with richer and more relevant experiences, and every user will have a unique Internet profile based on each user's own browsing history, in addition, Web 3.0 will then use this profile to modify the browsing experience to each individual, which means that if two different people each performed an Internet search with the same keywords using the same service, they'd receive different results determined by their individual profiles.

I think Web 3.0 is going to be like having a personal assistant who knows practically everything about you and can access all the information on the Internet to answer any question. It will completely change the way user interact with the web.

Web 3.0 privacy issue

As we start to involve into Web 3.0, there is a growing concern about the privacy. like I mentioned above that Web 3.0 is like having a personal assistant, it knows everything about you and knows exactly where you are and where you been, it might make people's life easier but at the same time what Web 3.0 offers are also seen as part of the fundamental reason most people fear it. Imagine all that personal information is out there, and no one knows where this information is stored or who controls it, this can be frightening. However, the Web 3.0 is still evolving, maybe the privacy problem can be treated in the future, as for now we can only rely on the security provided by Web 3.0.

Lastly, I don't think that the evolve of the technology will blurring the humanity, at least for now it will not be possible, as the humanity still prefers or needs social interaction.  

Here is a short video explaining Semantic Web:

Read More

Facebook's Terms of Service and Privacy Policy

For today's post, I'll be talking about one of the most popular social networking service Facebook, and how
they use your personal information and their action when there is a breach in security, which in this case, your Facebook account.

Firstly, your personal information that Facebook collects when you sign up with them and every time you interact or sharing information (photos, videos, comments, personal status, etc) on their website, do you ever wonder what exactly they doing with all that private information of yours? To answer that question, let me first tell you how Facebook makes money.

Facebook's Revenue

Facebook makes majority of its income in two ways advertising and collecting a fee from the app makers who use its Facebook Credit system. And to be successful at it, they need a lot of users to frequently interact the site, the more users Facebook has the higher the income.  

Information collected by Facebook

Facebook collects two types of information, personal details provided by user and usage data collected automatically as the user interact with the site.

Regarding personal information, there are a few pieces of data required to create a Facebook account, such as your name, gender and network. That information, along with your profile and cover photos, is publicly available and can not be changed other than deleting the account. Facebook may request permission to use user's email for notification purpose.

Facebook records website usage data, in terms of how users interact with each other and the site, commenting or sending a message, check-ins, Page likes, and other activity. Facebook then uses those data to improving the site or making marketing decisions(advertising), which allows advertisers to target their ads to the users.

You can read more about Facebook's Data Use Policy by clicking on the link.

Breach of Security

When it comes to breach of security, all Facebook does is to send the affected users a warning email stating that their personal information has been compromised, and then try to resolve the issue. You can read more about Facebook security by clicking on the link.

In the end, it all comes to protecting your personal information than what you can do after it's been compromised, because once it's happened it's too late and there isn't much you can do about it. So when it comes to using social network services (Facebook), only share information that is less private and you do not mind it been exposed to public, because we shouldn't fully trust any social network service.           

Read More

Benefits and Drawbacks of RSS Feed readers

As a requirement for this course, I have been testing out Feedly, which is one of the many feed readers.
Through out the week of testing Feedly, I have came across few benefits and drawbacks of it, which I'm going to talk about in this post.

Benefits of using RSS Feed reader(Feedly):

• Receive all the latest updates for the websites that I subscribed.
• Power of subscription to any website I want.
• Reduce web surfing time. Since the feed reader provides a summary of the related articles.
• Spam free, unlike email subscriptions, RSS does not make use of personal email address to send updates.
• Unsubscribing is easy, just a click of the delete button in Feedly or any other RSS feed readers, unlike email subscriptions where users are asked questions on why and then have to confirm unsubscribing. 

Drawbacks using RSS Feed reader(Feedly):

• Not all websites support RSS.
• Sometimes I receive news and updates that were not to my interests.

As you can see there are not much drawbacks on RSS Feeds. However, not all sites support RSS feeds kinda makes me not a big fan of it, but as for now, I'll be continue using it for this course, since I'm not sure how to follow other people's blogs on blogspot.  

Read More