Project Strengths

In preparation for your final project, my areas of skill/expertise are as follows:

1) Web Development: I have a good handle on coding HTML, CSS, and some javascript. I also have a good understanding of web infrastructure and administration.

2) Writing/Editing: I have a degree in English with an emphasis in professional writing and can produce or edit copy.

3) Graphic Design: I have experience doing some graphic editing in Photoshop, but do not have a trained eye for design.

4) Video: I have very little experience with video production or editing. It's a bit outside my wheelhouse.

Website Design Justification

For Project 2 (http://studentweb.engl.wsu.edu/355/tlivingston), I used the Azure template from http://templated.co. I chose this template because I am pretty comfortable with basic HTML and CSS and this template uses more complicated responsive design techniques. The biggest technical challenges were tracking where changes affected one size of screen versus another. I resolved this mostly by checking code, making small changes, and observing what was affected. Also, while not a technical issue, one of the biggest problems I had was thinking of useful content to use across the site. I find that content is always the part that is most important and often most challenging.

Ideally, my personal website would be more responsive, perhaps with better blocking. It would also include parallax scrolling techniques for interesting visuals and connectivity between pages. Unfortunately, this was beyond the scope of what I could put together for this project and is currently a little beyond my skill set. My ideal site would also be able to communicate with content the various aspects of my life I find interesting in a cohesive whole. I'm a bit of eclectic, perhaps disjointed person, and trying to find a way to express that, but still make it interesting AND professional is challenging.

The site makes heavy use of the Linguistic and Visual modes. Text describes me and my interests, photos and effects help to provide the mood and feel of the site, and color choices are designed to highlight some of my interests as well. The Spatial mode is also important. First in terms of UI, the layout has to be effective on various types of devices and conform to principles of responsive design. Second, the spatial mode is used along with principles of layout to highlight certain pieces of information such as current projects and concert dates. If I can obtain the recordings before the project is due, I will also make use of the Aural mode by placing recordings of my lead trumpet playing in the music section of the website.

For design strategies, I wanted to create a professional website that will not only provide a method for me to share what I do for my position with the Carson College of Business, but more importantly as a platform to begin sharing some of the personal creative projects that I have started to engage in. To that end I tried to provide emphasis and organization to the hierarchy of these projects. This is done first through word order, choice, and placement, especially in navigation and headings. I have attempted to make my job secondary, and more of a supporting effort to the other things I am doing. Layout and organization of the different elements and pages reinforces this, with opportunities for news and event dates right as the first things a user sees, along with examples of a current project, in this case Project 1. Finally color choices exist to keep the page looking like a professional page, with some of the photo effects suggesting that some of my work might be functioning "out of the box."

Sample Website

The website tutorial we did in class, located at: http://studentweb.engl.wsu.edu/355/tlivingston/sample/.

Storyboards

Below are the storyboards for my Project 1 assignment, which is a critical analysis of the Tiny Nation TV show as an informational campaign for the Tiny/Small House Movement.

I had some valuable feedback from some of my classmates, which you can see notated in the margins. Most of the feedback involved looking into greater detail on issues that I hadn't already considered in depth. For example, I should consider the logos of this particular assignment, i.e. why should someone watch this particular critique of the campaign.

Some of the points I am paying particular attention to are:

• The appeal of what makes this project unique.
• Be sure to indicate my own stance on why I love the campaign.
• Choice of font: relaxed, but modern
• Inclusion of music in addition to voice over
• Color palette choices: probably earth tones used in home decoration
• Paying attention to time during the Organizational section so that the larger amount of details don't make the project too long. Reduce details if need be and use a rolling/fading effect to overlap the data.

In preparing for this project I have a number of assets. They include:

• Video clip from pilot/demo episode of Tiny House Nation, 0:07" - 0:26".
• Tiny House Nation promotional photos from their website: http://www.fyi.tv/shows/tiny-house-nation
• Promotional photos from other home makeover/home renovation shows, obtained from individual websites.
• Video promo stills from Tiny House Nation website: http://www.fyi.tv/shows/tiny-house-nation
• Still of show logo taken from video.
• Video clip of usage of multi-framing: still determining best example of this.
• Voice over actor will be me, using headset microphone.

While I have yet to make specific choices on some of these, especially the photos and images, I believe that they will be easy to obtain as most of these assets are promotional images for the shows themselves or are small enough and used in such a way as to fall into the category of fair use.

Project 1: business unusual

For Project 1, I am going to look at the “business unusual” marketing campaign for nau clothing. The campaign initially appeals to me because I like the idea of sustainable living and forming an alliance with other likeminded organizations to “be the change.” However, the prices seem a bit ridiculous for an organization that is trying to promote sustainability. I will first examine the campaign homepage as well as the product lines and then branch out to other media sources from there. I'll see if I end up liking or hating the campaign and the company.

Chapter 2 write/design

For the Chapter 2 write/design assignment I chose to examine the mobile views of three university websites. These included the WSU housing and dining site, University of Washington home page, and the Washington Adventist University home page (I stumbled on it while fat-thumbing the WSU page) all viewed from an iPhone 5 running IOS 7. These are all share the same genre of university websites. The WSU page does fit somewhat differently into the genre since as the home page of a specific unit rather than a university home page, it effectively acts as a subset of the genre. However, I know that it uses a new template and design model that WSU is adopting across their entire web presence and I was interested in reviewing that new interface. I believe it is close enough to the other two sites to still make a valid comparison.

The WSU housing and dining was the best experience and most effective between all three sites. A banner across the top quickly identifies the author as Washington State University Housing and Residence Life. The template uses responsive web design to scale the existing web page to a smaller screen size. The navigation folds into a single banner underneath the header with the three line “Sandwich” symbol and the word “NAVIGATION” all in caps. This makes it easily identifiable and accessible. Beneath that are centered several commonly selected items, all as long full screen width buttons with text labels. All of this is laid out in black and crimson. The alignment and proximity of all the elements are laid out so that they are easy to find and comfortable to use. Beneath these elements a list of videos appear in a two column block. The icons for the first two videos are fully visible with part of the next row peaking above the end of the scroll line. The icons used for the video placeholders provide additional visual interest and the second partial row indicates to the user that there is additional content below.

The text of the various link and navigation elements make the audience specific and easily recognizable. This page is for current or potential students of WSU to explore housing options and to interact with the housing department if they already have a contract with one of the university-owned facilities. Right from the home page there are easy ways to pay your bill, fill out an application, or look up information about pricing, floor plans, and view videos of the various facilities. This is a highly successful mobile view for this website.

The second site, the University of Washington Home Page, is another example of adaptive design. However, this time as it adapts down to the smaller mobile screen size it focuses on a digital slideshow. From the mobile view this made it unclear on a few points. Since all I saw was a single photo, I couldn’t tell exactly who the intended audience was. In fact, the first photo that popped up for me was related to football, and since there wasn’t enough other types of information or obvious navigational clues, I thought I had stumbled into an athletics sub-site, rather than the top-level home page. In addition, there wasn’t anything on the page that gave an indication that there was more information available in the slideshow or further down the page. Furthermore, once I realized I could swipe to switch images in the slideshow, it started causing twitch in the interface that made it impossible to navigate. Overall, I found this to be an ineffective mobile view. The organization made it so audience and access to information was unclear, and the user interface was buggy and distracting.

The third site, Washington Adventist University, merely scales down the homepage to the smaller-sized screen. In some respects, this works ok. The site’s organization is still there so audience and purpose are easily determined. However, many of the textual elements are too small to read and there are too many items for a smaller mobile interface. This makes navigation difficult as well as any detailed look into the content. Still, of the three sites, it is second, because it is functional and purpose and audience are apparent, whereas the UW site completely breaks down.

 

Process! Chapter 1

For this assignment we were directed to review two different Twitter profiles. I chose Maxine Kwok-Adams, London Symphony Violinist and William Shatner, actor and director. The differences between the two profiles are immediately apparent. Kwok-Adams’ profile is bright and colorful. She uses a glam gel shot of her and her violin for the profile pic and the cover photo is of the violin with bedazzled designs on the back. These photos match up well with her tagline which reads, “@londonsymphony violinist who loves bling and is never knowingly underdressed.” The two photos she chose emphasize these three aspects. The appearance of the violin in both photos denotes Kwok-Adams’ profession and the main reason someone would follow her on Twitter. The glam shot for a profile pic emphasizes her interest in fashion, while the bedazzled designs on the cover photo show her “love of bling.” They also provide other topics of interest for her followers. Kwok-Adams also peppers her posts with photos of her travels as a member of the orchestra. As a result, her profile is saturated with colors and images similar to her profile and cover pictures.

By contrast, Shatner’s account is quite minimalist. His profile photo is black and white, with his shoulders and the edges of his features fading into dark shadow. His face is expressionless, possibly with a slight glare of condescension. The cover photo is of an old leather desk cover, something used to protect a desk from damage while writing with pens and pencils. However, there are no pages of writing, or pens, or pencils. Just a set of sticky notes in the top left corner showing his “To Do” list. The list itself has only three items: “Win GISHWHES,” “Torment Whats his name,” and “Stir up trouble.” These visual features work well with the persona that Shatner has created for himself: that of an eccentric professional who dabbles in any and all projects that peak his interest, ranging from his most well-known role as Captain Kirk of the Star Trek franchise, to other TV shows, comedy sketches, Priceline commercials, documentaries, Broadway shows, and even musical albums. The desk cover shows this through both visual and spatial means, providing a virtual blank slate, but using the leather texture to evoke feelings of experience and sophistication. The viewer of this twitter account gets the impression that anything could come from this person, but no matter what, it will be interesting. The stark and minimalist visual and textual references are also excellent at demonstrating Shatner’s sarcastic personality. He likes to cause trouble (sometimes for merriment, sometimes for social change), and you can see it visually in his profile picture even before reading his posts. The minimalist approach to his twitter profile continues with a predominance of textual posts. Unlike Kwok-Adams, who posts photos and video regularly, Shatner’s posts are almost entirely text-based. Out of 16.7K posts, Kwok-Adams has 3,269 videos, while out of Shatner’s larger 20.5K posts, only 720 of them contain photos or video.

These two performers both effectively use twitter to communicate with their fans. They are able to do so by being authentic to their personal styles—a fun, musician-fashionista and a multi-talented, experienced, eccentric—and using visual, spatial, and textual tools to portray that style.

Who me?

My name is Tyson Livingston. I have geek-cred in a number of different areas from music to gaming to technology, but currently I hang my hat at Washington State University where I work for the Carson College of Business Office of Technology. I manage the college’s creative services team and do web, database, SharePoint, and applications administration. I am currently using the staff tuition-waiver to get a MA in music, but am taking this class as a means to learn more of the authoring/design side of my job.

I have some experience with multimedia authoring, mostly from the platform and administration side. I have developed content management systems in SharePoint, manage web sites and services, and developed and coded various web sites and web documents. I am looking forward to all this class has to offer and learning more about the content creation side of the fence.