CHRISTEN JANINE OTTER

Reflection on Responsive Web Design and Designing for Emotion

In my last post, there were several items on my website for Internet and Writing Studies I mentioned that I was working toward. Among them was the Portfolio page. I stated that I wanted my page to contain five portfolio items: innovate, radio, writing, interactive and work.

Since then, working toward toward a more streamlined end, after conferencing with Bill Wolff, it was decided that having three boxes instead of five was more effective. The updated content areas now consist of Writing, Online Media and Radio. On my Portfolio page, each content area functions as a link, as opposed to only the text being the link. My rationale for making the entire content area of each Portfolio offering a link was to provide a greater level of flexibility of navigation for the user, as well as unity and cohesiveness of content in my design.

In terms of my work samples, deciding what to feature in each of the content areas was a bit of a challenge because a lot of what I do overlaps and nothing is really ‘clear cut’. However, for the Online Media content area, I wanted to dedicate that space for items that have an interactive element or projects that are multidisciplinary in nature.

When a reader comes across project offerings on my Portfolio page, I want to convey to them a bit of who I am as well as what I do. The means through which I accomplish this is through the design choices embodied in my visual lexicon, such as layout, typography, color scheme, images and navigation. The Portfolio page is important; within a split second the user will either be curious and drawn in, or decide to move on. Therefore, I want my design to communicate clearly without being so avant-garde that the meaning is convoluted, yet not such a dead give-away that there is no allure. Therefore, I found images that are ‘iconic’ of  the conventions that they represent. Second, I wanted to bring in my own persona; therefore what I did is carefully stylize the images so that they capture an old world flair and analog romance. I am a book lover and artist and as such, I appreciate the experience of elegant tangibility and craftsmanship.

Therefore, I worked toward two objectives. In terms of a visual lexicon, the theme of my website is image focused, instead the emphasis being on the text, with some mere accompanying graphics. I believe in autonomy of the image. Text should be used to help ground the image so that meaning translates intuitively, yet does not complicate or compete with the image.

In terms of responsiveness, each page has been coded on a flexible grid layout so that the content responds in a consistent manner, no matter what device is being used to view it. I tested my website by viewing it on a 17″ laptop, a iPad and an iPhone. Additionally, in terms of web standards, each page was rigorously tested to pass the W3C  HTML and CSS validation. At the bottom of each page, you’ll see a widget for both the HTML and CSS that takes you right to the WC3 page which verifies that the page passes with no errors. Getting the site to pass validation was a task that was extremely tedious and time consuming, and often mystifying and frustrating. However, it is important because all of the hard work that was put into the site might not translate to a viewer if it does not have a clean semantic.

In sum, in terms of emotional and responsive design, I wanted my site to embody a design that is very human centered. I feel that my design choices are congruent with my design philosophy, as they relate to composing with images and writing in within a context of multimodality.

In Designing for Emotion, Aarron Walter asserts:

Our definition of beauty originates in our own image. The human mind is exceptionally skilled at scanning objects and information to discover meaning in abstract forms. We can find traces of ourselves in most anything we see, and we like that (21).

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Information

This entry was posted on January 2, 2013 by and tagged , , , , , .
Raiders of the Lost Architecture!

FUTHARK • Aleph Beta Gimmel Daleth He • ABCDEFG

waynestainrook

The official blog of the grad student, gamer, mascot and wino

tomwink

Currently blogging about web design and a feminist reading of comics

Michael Youngkin's Blog

Musical bricoleur

Kimberly Erskine

Writer, Christian, SEO/Social Media Marketer, Book Reviewer, Deaf and Loud.

Christina Maxwell

Everybody wants to rule the world

Megg's Internet Writing Blog

experimenting with HTML and CSS coding

jaminmc

Just another WordPress.com site

RU Art

Inside Rowan University's Art Department

%d bloggers like this: