Mustache Gallery

This one is a little different. I love how the user-interaction with the images throughout the page. As you move your mouse and hover over the images, the boxes move in such way that in interact with the user. The way content slides across the page as you click a process adds an aesthetic look. Not too much clutter to make the user feel overwhelmed, big images that load quickly.

TED Ideas Worth Spreading

Its pretty obvious that this is a “Pintrest” style layout for a video gallery. Nothing is in a perfect grid, but more of a bunch of rectangles that fit together. Like Uniqlo, it has a very simple gallery of videos, nothing too complicated, no need for clicking for than twice to get to the page you want. You can tag a few keywords on the left of the page, and without the need to press enter, the page refreshes on its own and give you the videos you want. After clicking the videos (which bring you to a separate page) you can watch the video. One of the best things about this website for me is it actually has captioning, a hard-of-hearing persons dream. The user accessibility this site has is amazing, as it puts the viewer’s needs first.

Uniqlo Gallery

This is a very unique gallery for an online clothes store. Uniqlo is known to have very cheap “straight-to-the-point” clothes by designers from all around the world. The stores are very well built and eye catching, just like the website. As you scroll down the page, it refreshes to load more clothing options. You can hover over the picture that captures your attention and have a “quick look” box appear in case you want to see it close up and add it to your cart. The user interface is very modern and straight to the point.

Two new CSS codes I learned.

This article tells me how to style a “button link”. But the two codes that I learned in this tutorial are the no-select, and the transition code.The codes written for css are shown as:

-webkit-user-select:none;

-moz-user-select:none;

-ms-user-select:none;

user-select:none;

This allows the user to not select anything within the body of the html page. This can be useful for people who overclick and end up selecting the word or sentence. Also good if you don’t like the unclean feeling of selecting the whole page.

-webkit-transition-duration: 0.2s;

-moz-transition-duration: 0.2s;

transition-duration: 0.2s;

These can be useful for providing a clean transition between a hover state, an active state, and a normal state for a button or an image. This is great for pages who want to have a very user-interface feel.

A Website that Succeeds the User #2

Unilever is a worldwide company that’s “green” in providing care to it’s customers. It is one of the largest branding companies compared to P&G.

1. User-Friendly. The layout is loads very quick for its customers. The layout itself is very user-friendly with fun shapes and movable css. If you scroll, the background revolves around the page to create a sense of depth. People of any age can view this website to learn about not just the company but how the world is keeping itself “green”.

2. Less Clicks to get where you want. The Navigation Bar is designed in a way to get the user to the page they want to visit as fast as possible. The Navbar allows the user to cover, without clicking, to access the drop down menu. Then with one click, they can visit the page they want to visit. No one wants to have to click more than twice, otherwise there is a chance they might get lost into the website.

3.UI Design. User-Interface Design is big at the moment. Unilever is a very flexible and whimsical company. The user interface design on the website perfectly captures that. The design of the sections, at the same time have an off-balance and balance to show that the company is serious about its young fan base. A playful UI is best for all ages than a serious UI.

A Website that Succeeds the User #1

If you have not heard of Reddit, you have yet to experience the many wonders of the internet.

1. User-Friendly. Anyone can sign up and post links to interesting things that are happening around the world. Its very easy to get used to a website like this, even for all age groups. Reddit is mostly a social network controlled by imaginary Karma known as “Upvotes” and “Downvotes”. Anything a user will upvote or downvote will determine the links spot on a page. Reddit also has subreddits that users can create based off their hobbies like politics, life pro tips, or plain weird ones like subreddits that consist of funny TV advertisements.

2. Mystery Meat. Users love a website they can never stop browsing. Mystery Meat is what I would call a bunch of links that lead to mysterious pages you may like. Reddit consists of subreddits that fit a particular theme like funny pictures, pet pictures, batman, gaming, or politics. You can simply enter in the url /r/gaming or /r/design to view the specific subreddit. The excitement of mysery meat is entering a random url in hopes for a subreddit to match what you typed. For example if you love penguins, you can try and enter /r/pengiuns to see if there is a subreddit for that. Unlimited Mystery Meat=Unlimited Browsing.

3. Compatibility. The structure of Reddit makes up for the lack of design. It is a very straight-forward website that can be viewed beautifully on any computer old or new.  In fact users of Reddit have created plugins that make browsing Reddit easier and favorite frequent subreddits. They can also upvote and downvote posts with one touch of the keyboard.

A Website that Fails the User #2

This is the a National Polling Research Group’s Website.

1. Just like George R.R. Martin’s Website, this one is heavily image-based. The navagation bars are just pictures that change when hovered over. Each picture is a very low quality jpg. The background contains a stretched lighthouse to represent the Pharos Lighthouse.

2. No Structure for each text. Most of the text is just free-floating on the html page without a reason of being there. PDF download links are displayed on both the left and right. Its very hard to think of the home page as an actual homepage. The html structure lacks a reason of the pdfs to free-float on the page.Most of the PDF links to not even download a file. The Navigation Bar changes as you go page to page, which makes it confusing to navigate.

3. Unneeded Text. The breaking news at the top of the home page does not contain any actual breaking news. The overall feel of the website does not bring me a reason to trust the information it is giving me.