Week 5 Reading

What makes up interaction design and what are some of the industry’s challenges?
Interaction design is a system of design that focuses on people by defining a problem, then investigating and designing based on the way people use things. Challenges for the industry would include a lack of understanding of the process or its importance. Because of this lack of understanding, designers are often not given the space, time, or resources to conduct proper research, and their input may not be taken if other specialists have different opinions.

What is interaction design, how it’s evolving. What fields does it draw knowledge from?
Interaction Design is a design philosophy that focuses on people. It is interesting in that it is actively evolving in both academic and business settings, with universities and companies making advances independently and jointly. It draws from more conventional, ‘fine art’ style design philosophies, as well as social sciences (e.g. sociology) and applied sciences like engineering.

Review #2

On the site called Echo at echo-pr.co.uk, the concept that they pushed out to the general audience is very intriguing at first, but it can be very hard on the eyes for some or almost all viewers. First things first, the site starts off with the word ECHO in bold lettering but the texture is thin stripes running down from left to right through the text. The text itself is a light grey color that is put in that color only to showcase its idea behind the website which I will explain later on. It throws me off a bit not only with the stripes, but it is very hard on me to read such a contrasting color with a bunch of stripes running through the page. I get their idea behind it, but it creates such a distraction to the site that could potentially turn away clients/consumers.

Their website has a “switch” widget on the upper left hand side that turns the texture from black stripes with a white background, into white stripes with a black background. This idea is what they called their “switch-on” implementation of making an impact on the layout. The next page while scrolling down switches the text ECHO into diagonal type, which is very interesting in my opinion, then later on breaks off the lettering each time you scroll down.

Now the site’s design is very simple and basically bold with black and white textures and formed layout, but overall it connects in such a way that it flows directly from top to bottom without any contortion through navigation, layout, or scrolling sequences.It’s grid, although some images and text overflows through one another at times, is in a proper format and doesn’t throw off the set details behind the sites idea and design.

Overall, the grid used in the website’s design may be simplistic to a degree, but it controls it’s own layout and the colors and textures are primarily created through implementation of black and white. Although the colors may be simple, it all comes down to how the website portrays it’s usage to the colors.

SMild_Thoughts on Interactive Design Chapters 1&2

  • What makes up interaction design and what are some of the industry’s challenges?

Define, Discover, Synthesize, Construct, Refine, and Reflect make up interaction design.  Designers rarely start with a blank slate and they have to convey/understand what the client is asking for/wants.

  • What is interaction design, how its evolving. What fields does it draw knowledge from?

Interaction Design is a creative process focused on people.  It draws knowledge from fields such as engineering and marketing.

 

1_ecarrington_Web

I chose Puma.com for my review. Puma is a clothing site that sells sporting equipment and sport-related active-wear, including shoes, clothing and accessories for men, women and kids. The main navigation shows an image slider that presents the viewer with ways to use their products, and inspires a purchase. These images have buttons that are linked to relevant pages, making them effective for the main spot of the site (What is called a hero image). There is a navigation bar with their logo as an identifier, dropdowns for genders and age, sales, categories and a search bar.

Scrolling down, there are big image views that link to shopping for different categories, such as ACTV, men’s and women’s. Near the footer, there is a social section, which shows items that are trending and social media links to follow Puma. At the bottom is a site map, email sign up and find a store search bar.

Following through with finding an item, I clicked on the semi-annual 50% off sale because it caught my eye and offered a discount on items that I know will be somewhat expensive. I know of the quality of Puma, even without owning a lot of this brand, by taking into account their web presence and images I have seen so far. On the sale page, the first thing I see are shoes and a bright red bar that says “Free shipping on orders over $75.” I clicked the Price[Low] button to sort the sale items. After scrolling for a bit, I found a hat that I liked and clicked on it.

When on that page, there were no reviews, which immediately caught my eye. Being someone who depends on quality of products, I like looking to reviews for reinforcement or more information. I added the item to cart and a dropdown showed me a button that said checkout, which condensed. I clicked the checkout button on the shopping cart page and was told to enter information, if I had a Puma account or guest checkout.

On the next page, as a guest, I auto-filled my information and tried to go to the Payment page. This did NOT work. I rechecked my information and required fields, and did not find anything missing, and nothing on the site said I was doing anything incorrectly. After trying 5 times, I gave up on the purchase. This has never happened before, but I will not be shopping on the Puma site again. Upon inspection, an optional button that says “My shipping address is different than my payment address“ was unchecked, but contained many errors when checked. They should require this button, instead of marking optional.

 

Review 1

For my website to review, I chose Sony. Sony’s website and company altogether deals with technology, such as T.V.’s, video equipment, phone accessories, computer software, etc.. The layout is a bit simplistic as it deals with the interface. The top layout is very simple and easy to navigate through for what I was trying to search through.  For most websites the search bar is located at the top right hand side of the interface.  Now with this search bar comes the great addition of adding in a query and locating terms that many other consumers have come across. This helps with a quick and responsive user interface experience. Not only was the search for the item easy and obtainable in a matter of seconds, but based on the tabs that contained the different categories, it was easy to maneuver around for what I was trying to look for. If I needed to go back a step with a category tab, I could easily look to my top left corner and click on the link stating, the previous page and the homepage.

When I need to search for something dealing with a certain category, I found a bunch of bundle deals that were put on display for consumers looking for a particular type of item. For example, in the book called “Don’t Make Me Think” it describes the normal consumer trying to process their thinking by quickly finding and containing the click- able tabs that don’t puzzle or creates a long thinking process of “is this___? or is that a way to get to this?”. This website greatly uses the images to work well within the background and it uses the rule of thirds decently. I say decently due to the fact that the tabs on the top of the page are a bit meshed together. The first row of tabs deals with relatively first look items that consumers look for, plus deals within the company for that week or month. The second row is the different categorical items that you can choose from and uses the images to provide a definitive look at what each software, equipment, accessory can look visually.

If I could choose a couple of things I could improve on with this website, it would be the text color on the small text which is a little harder to read if you have somewhat bad eye site. If anything, I would just make it a bit more darker hue. Furthermore, the first row tabs could be moved towards the left side of the page to grasp at the readers attention and since it is native for most people to read left to right. Other than the small little tweaks that can be made, the overall site design, user-interface, and tab location is very well done and user friendly. Controlling what you want to click on and being able to not think about what a certain search bar or click function will do is very important for customers, because it makes for a better experience and creates a better understanding to the site for others out there.

Reverb site review

Much like Etsy, but for musicians, Reverb.com is an online marketplace that allows individuals to buy and sell new, used, and even homemade musical instruments and accessories for just about anything one might want to (or can) play.

From the start, the webpage is well organized and easy to navigate: In the header of the page next to their logo is the search bar and links for their blog, login, and if I’d like to sell something; the header stays at the top of the page as you scroll, making it easy to search for something if you remember what you want at a time when it’s not convenient to click on another link. The top of the home page is dusted with a few ads for different parts of the site such as deals, sales, and interesting products they have to offer. Scrolling down a bit, one finds a grid of various products that they have to offer, lined to the side with a category box narrowing down the types of items they carry (guitars, amps, drums, folk instruments, etc…); followed by a list of brands throughout the site for those looking for something more specific, and another which filters the year the product(s) were made, for the more enthusiast types.

I’m in the market for a delay pedal, but aren’t too sure of any brand or type, so I scroll down to the categories box and select “Effects & Pedals” knowing that’s where I want to start looking. I’m then redirected to page similar to that of the home page, but with the grid to the side focusing solely on pedals, and the different kinds listed beneath my initial selection in the categories panel. I click on “Delay” and am taken to another gridded page showing the different delay pedals they offer; I click on a Boss DD-7 as it’s one of the first on the page (and one I’ve been looking into), and am taken to a page that shows me pictures of the product the seller has posted, details about it that I might be interested in knowing, and options to buy, make an offer, contact seller, and so on. I click “Add to Cart” and am redirected to a page that gives me the option to either finalize my purchase, or continue on shopping; I click on the logo in the header and return to the home screen.

As described in the reading for a functional and well-designed site, navigating Reverb.com was effortless and near thoughtless. Everything was organized in such a way that getting to where I wanted to go was literally just a few clicks away. There weren’t any confusing hard to understand headings, series of listings that had nothing to do with what I wanted, just straightforward and to the point navigation.

Ease of Access by Brandon Kreiser

TigerDirect is one of the most popular online retailers of computers and other electronics. The site provides an easy to understand and fun experience for the user and/or possible buyer. I used the site to look for an Intel Core i7-5930K 3.5GHz 6-Core Processor. Buying computer parts can be one of the most challenging things to buy online because of the limitless part models, retailers, and manufacturers. TigerDirect does a very good job at keeping electronic purchases simple and understandable.

One of the first things I noticed when I went to the TigerDirect website was the simple design and layout. The company name and search bar were the first things I spotted, helping the user know exactly where they are. The close proximity of the search bar to the site name helps the user that knows exactly what he wants to buy. For the user that may not be sure what they are looking to find, there are many buttons and pictures on the screen to assist in the search of an item. While there are in fact many buttons to click on, TigerDirect keeps things obviously clickable. The book “Don’t Make Me Think” by Steve Krug discusses the importance of keeping buttons clearly clickable to avoid user confusion (2014).

Another effective strategy used on TigerDirects website is the way that users check out once they have found the item(s) they were looking for. The process is not as quick as Amazon’s one-click-purchasing, but I think that it’s even better. After clicking the purchase button and finalizing the items in the shopping cart TigerDirect brings you to a page where the user can log into TigerDirect and enter their billing information. But even better yet, the site lets the user pick other vendors to pay through in order to make the payment process more customizable. The user pay through TigerDirect, PayPal, VISA Checkout, MasterPass, Amazon, or Google Wallet. I’m not able to think of many other websites that gives the user so many payment options. To make the deal even better TigerDirect accepts American Express, Master Card, Visa, and Discover; not all sites accept American Express, and Discover. This ease of payment actually makes this part of shopping, when the buyer loses money, seem like the best part of shopping. It could not be a better system in my opinion.

The last element of design incorporated into TigerDirects website that impresses me the most is their easy-to-scan pages. “Don’t Make Me Think” stresses the importance of keeping information easy to read and scanable so the user does not need to spend vast amounts of time reading information (Krug, 2014). Buying electronic parts can be such a difficult process because of how much technical information is involved. I personally hate buying electronics from sites like Wal-Mart, Target, and especially Amazon. They all fail to give me the technical information I need on a computer product. For example, when attempting to buy an external hard drive on Amazon.com the technical information provided with the product rarely has information of the rotation speed of the disk; which requires extra research on the users end. TigerDirect always gives every technical detail of electronic parts that are given by the part manufacturer. In the case of the external hard drives, TigerDirect provides the rotation speed of the disk as long as that information is available from the manufacturer. TigerDirect even gives links to the manufacturer’s website so the user can look for even more information about the part before they purchase it. This ease-of-access system for computer and other electronic pieces is what makes TigerDirect a very easy and simple to use website.

There are many online retailers that have easy to use designs and unbeatable prices. I feel that TigerDirect is one of the best retailers for any electronic equipment because of the easy to navigate pages, obviously clickable buttons, numerous payment options, and easy to scan, yet detailed technical information provided with each part. Attempting to buy and find the Intel Core i7-5930K 3.5GHz 6-Core Processor could not have been easier, and I would recommend TigerDirect to anyone shopping online.

Alec Balenciaga Amazon Review

Amazon has always been very good to me when I search for something.  I was looking for guitars because I am always looking into guitars but because its such a broad spectrum and I wanted to see how Amazon would help me find what I’m looking for.

First thing that was really nice was when I typed in “guitars” in the search bar it automatically showed different types of guitars I could also search for or begin to narrow down my search.  It gives me different departments I could look in first like “Instruments” or “Toys”.  Then Amazon gave me different ways to finish my search like “guitars for kids” or “guitars for sale”, again giving me the option to narrow my search fast so that I could find what I’m looking for and get on with my day.

So once I searched “guitars” I noticed immediately that Amazon was built to be scanned. Everything important stands out from the other text due to size and color. To me having price in red is the biggest thing because it catches the eye and when people know what they are looking for the next thing is comparing prices.  Amazon also offers more refined searches on the left side bar.  For me when I was looking to see how Amazon would help me find a guitar this is exactly what I wanted. The side bar starts by giving you more specific categories under your search, so I had different options like “acoustic guitars”, “electric guitars”, “kits” etc. I decided to refine my search and click on “electric guitars” and It brought me to exactly what I wanted.  Amazon still stayed very skim-able and yet again giving me even more ways to refine my search so that it was easier for me to find what I am looking for.  Categorizes like brands and price ranges allowed me to really narrow down what I am trying to find and also giving me a lot of different options.  The best part was the fact that It was easy to find different subcategories, I wasn’t hunting around the website trying to find where I can refine my search.  It was right there and easy to look through and find another category.  Along with the subcategories, Amazon is great with leaving bread crumbs. Say I keep digging and digging for something but I then decide to hop back to a category I was in 3 pages ago then I just have to look up and click back to that category instead of using the back button like everyone else.

The ordering process my have been the easiest part of the whole experience.  There is nothing tricky about it. Everything that you need to click to proceed with your order is very visible and is obviously a button to press. I would say the page after page is a little much but you know what you have to do on each page, there is nothing to try to trick you.

I would say Amazon has everything down to a science when someone comes to their website to buy something. It is simply, user-friendly, not cluttered, and you can get in and get done very quickly. My shopping experience with Amazon is what every site’s should be, quick and painless.

Review 1

Chapter 1 of “Don’t Make Me Think” will have readers realizing just how effective and non effective a web page can be. Last week I visited an effective website called Amazon.

Amazon is a very simple looking website compared to most but because of it’s simplicity, I find it pleasing to look at. At the top center of the page you have your search bar, which is nice and big instead of off to the right in a small corner like most websites have them. Since the search bar is the first thing you see when the page pops up, it literally takes you a couple seconds to search for what you want. I went looking for a 521 Nokia Lumia phone case. It took about two seconds for the page to navigate to another page with a list of results.

On this page you are shown several different options varying in price, color and style. I didn’t have to use the “Shop by Department” drop box, on the top left hand side, because Amazon took me exactly where I wanted to go by using my key words. What I didn’t know, however, was exactly which case I wanted to purchase. So what I did was narrow down my search results by using the “refine by” column on the left side of the page. Free Shipping by Amazon: check, Condition: new (check), Price: $0 to $5…GO (check).

There is one thing that I wish Amazon would improve. One thing that wasn’t the greatest while narrowing down my results was that for each refining I checked, the page would reload itself with new results. I checked off three things to narrow down my search and the page reloaded 3 times with different results from the last. Chapter 1 of “Don’t Make Me Think” mentions several times that web users are “usually in a hurry” which is true in most causes! So I think it was a poor choice to have the page keep reloading every time a customer clicked an option that narrowed down their result.

I think it would have been more efficient if you could click all the things you want and then have the page refresh it self. Other than the page reloading several times, the website is pretty much the closet thing you’ll get to easy, online shopping. The check out process was simple and easy. Users of all age and web experiences can operate amazon.com with just a few clicks here and there. Never once did I get frustrated or question, “What is this” or “where should I go”, like Chapter 1 suggested web users do. The simplicity of Amazon’s layout makes it pretty easy to find what you’re looking for.

 

Lauren Byrnes: Review #1

As one use to frequent the salon or local drugstore once a month I frequently shop for make up conveniently online, well to be completely honest if you can buy it online I am most likely shopping online for it. Consistently each month I order the same beauty products as they run out, through my preferred choice cosmetic supplier, Ulta Beauty. With five easy steps I have what I need in my cart. Upon check out, after I log in and confirm my saved shipping address and select my saved method of payment, weather it be my credit card or my debt card that month, both are there at my convince. Just a few more clicks and I have my items on their way to my front door.

For someone who is not as familiar with the web site, or with beauty products in general, the website follows all the rules in order to prevent the user from exhausting any unnecessary brain function. The website starts to guide the user with first glance, you see a navigation menu on the left side of the homepage and to the upper right there is a search bar. If using the search bar, the site will compose a list possible search options in order to help guide you faster. Like many search sites this is not an unfamiliar feature but nonetheless it makes the site think for us, providing the guidance and convinced we are looking for. If one not sure of the exact product, the menu has categories that begin rather vague but become more specific as they lead you to the item you may be looking for. After choosing “make up”, then “foundation”, you may already have found the products you are looking for if not, there are more filtering options to narrow down the product search. This offers such categories as type of foundation, price range, brand, or even as specific as the amount of coverage you would like. The user doesn’t even have to know what exact product you are looking for but he web site will provide the user with enough direction to send them right to where they need to be. And just a few more steps and they are set up for a first time user check our or able to login and have the web site enter the requited stored information for them.

Either a website works or it doesn’t, there is no in-between. In order for a site to function the information the site provides needs to be clearly displayed, and even more importantly, clearly labeled. Categories and sub categories are what provide the user with direction, with miss leading titles one can get lost and then choose a different site to search. In order to keep the users attention you want to fundamentally make the choices for them. Put the answer right in their face. We as humans want everything as convenient as it can be, tell me what I’m looking for and show me where it is. We expect this not only from customer service at a department store with human interaction with one of their employees, now we expect the same if not more convenience and direction from the websites for those same services, minus the tedious trip to the store.

Ultas’ web site uses a gird base layout and minimal use of color. It’s very easy on the eye and neatly done as far as an aesthetic point of view. The website provides organization of categories and subcategories as well as clear labeling. Someone who knows nothing about makeup or beauty products can find something as simple as what shampoo they want or even make an appointment for the salon with no disruption, the site illustrations what rout that you need to take to get you to the service or produce you need with no noise in-between.

Merritt Donoghue Review 1

I chose ModCloth for my first review. ModCloth is known for their vintage clothing but also sell shoes, accessories, socks, and home decor. It is all listed across the top of the website, each category including a drop-down menu for specific searching. It is also pleasing to see pictures available on the drop-down menu.

The website had a color scheme of white with variations of blue for the text and search bars. Overall, the layout of the website is very welcoming to a new shopper. The site is clean and simple to read and control. The one thing I dislike is the light variations of blue, since it is harder to read fast.

After browsing, I chose to “buy” a pair of shoes. The page changed into a dominating picture of the shoes with options to zoom in for a closer look, choose a shoe size, and see customer reviews. I then chose to proceed by clicking the red “Add to my Bag” option and was sent directly to checkout. At this point I had the options of checking out, removing the item, or continuing to shop. On this page, the checkout button were prominent in color (red) and text (bold).

Overall, Modcloth is a great website for vintage shoppers who are looking for a quality item, fast.

Review #1

While reviewing Shoedazzle.com, a few complications were noticed upon first visiting the website. Upon visiting, shoedazzle’s website was confusing because there were links leading to ‘getting started’ on the website, when I was looking on where to click to start browsing the site. I looked around, scrolled down but the only way forward was to ‘get started’, which what was assumed to be creating an account. This may not be very successful because myself and others want to browse a website before deciding to make an account, and being forced to simply makes me want to close the website and browse elsewhere.

Surprisingly, there was a quiz to get the best style taste from users instead of setting up an account. Already feeling impatient because most websites allow users to browse their site right away rather than forcing them to create an account, I went through the quiz as fast as I could. The quiz is a great gesture, but should be an option for users instead of being required. Once finished, I was able to create an account and was finally happy. The full website was accessed at this point.

The navigation was easy to use and easy to find, and the website made finding everything simple without looking too far to find anything. When checking out an item, there is another page showing more products for last minute buying and to market more products. This was annoying because once a person reaches checkout, surely they want to buy the product and move on instead of being forced to look at another page of products.

The design of the website was very clean, simple, easy to read and easy to navigate. The overall design of the website and navigation worked well and was user friendly. A suggestion to make this website better is to not force users to have to sign up or go through a quiz in order to browse their site. Most users want to browse, buy, and leave. If users really like a website and its products, then they will create an account.

2_ecarrington_Scope

The overall strategy of FuelPass is reliant on its goals. It is, quite simply, an EZ-Pass for gas, with goals to be intuitive, simple, powerful and reliant. Intuition stems from an easy-to-use interface, simple explanations for detailed use-cases and a well-designed information architecture that shows where the user is, relative to the home page. Simplicity and powerfulness relate when an action can callback to a powerful function or method. These facets will be apparent when the user pulls up to get gas and do not have to go through the normal routine. Reliant technologies can be created as infrastructure is built up on a scalable, relational database. Once users are feeding in exponential data, and this data is crunched algorithmically, reliability will be improved. Even on a small scale, reliableness may stem from talking to users on a case-by-case basis, to ensure technology is working as it should.

The user wants to easily purchase gas, and can do so without the use of cash or a card, with FuelPass. They may not even have to leave their car, in applicable cases. They may hope to gain insight into what FuelPass is. In their case, they will need pictures of the product, explanations, a shopping cart for purchasing, a login system for saving their information, etc. As the creator of the website, I hope that all interactions leave the user with a positive feeling about the site and product, and do not automatically turn users off with gimmicks or useless pages, features, etc. The point would be to consolidate information, eliminate redundancies and elicit positive emotions.
The strategy and features of a site align themselves clearly. The creation of the mobile website or application will match the goals defined above, such as simplicity and intuitiveness. Technology will be cloud-based, to update profiles and balances on the fly. A user will see their balance, where they purchased gas from, a sheet of electronic receipts, and their rewards score. A function that sends this data will be based on pings from the chip, embedded in FuelPass. Once a secure connection is established, the user is able to get gas, to their chosen amount, and this data is fed to the cloud-connected servers, which update the user’s account.

There will be geo-relative chips embedded in the actual product that also relay information to the cloud, resulting in a heat map of your most used locations. This will be useful for showing most popular locations, giving increased rewards for return customers and showing where other users were able to use FuelPass. These chips will only transmit location data relative to gas stations, as laid out in the terms of use and privacy policies.

A rewards system, also available on the site, will be available to save money on gas automatically. This reward percentage is shown in the app, and this data is also provided by a simple calculation, server-side, based on amount of gas purchased, at what price, and from what provider.

Choosing to use a separate payment system, percentage saved based on location and relative notifications are available as additional features within the website. The creation of the site will provide useful information on the product, locations, rewards, and a consolidated login system. Users can learn more, order FuelPass and check their profile using this site.

Project 1a – Scope and Strategy

Scope

            Our site is boiled down to four main elements. The first is a simple video that begins by introducing our product and explaining the problem. From there, the video will show how our product solves that problem via a side by side scene of an average morning with and without our product. This part of the video will explain each element of the system and how it works. Finally we will ask visitors for their help in funding our product.

Secondly, we have section of copy and graphics that breaks the system down to each of its physical parts as well as companion app that works with the system. The point of this section is to drill down into the details of our system and educate the user as thoroughly as possible. While most of this section will consist of simple text and graphics, we plan on building an example screen of the app in javascript that the user can interact with on the mobile site as if it was running on their phone.

Another tertiary, but still very important part of our website will be the contact portion. Here users can engage with us on social media, sign up for a newsletter, or even pose a question to the creators of the product.

Finally, our call to action is represented with a simple button prompting the user to fund our project. This section goes hand in hand with the final one: a list of rewards supporters will receive based on their contributions. These could range from a simple thank you or t-shirt all the way up to a limited edition version of the product once it is completed.

Strategy

            The main strategy of this site will focus on educating the user of the problem statement our product hopes to solve and how it goes about doing so. From there, we can move on to motivating them to fund our project as a call to action. On the face of it, our product sounds simply enough: applying the “smart home” movement to your closet to bring it into this century. However, this idea quickly breaks down into complexities that could leave potential backers with a lot of questions. How do you record your clothes? How does it signal clothes to take off the rack? How does it know which piece of clothing is tied to which hanger? All of these questions could bring one to wonder if it is really worth the trouble for a product that could easily be seen as extravagant. For that reason, are designing a step by step description that will leave visitors of our site with a solid explanation of how our product solves the problem at hand. After seeing all of the capabilities of our product laid out, our target audience of clothing junkies with expendable income will easily be able to validate the purchase.

Fortunately, this structure leads us to a logical call to action. After we explain why this product is needed, we give the easily understandable explanation of the process, followed finally by a prompt to support out project along with the rewards backers can plan to receive up on funding