Content Audits: Regional Fair Sites

Abbreviated content audit for the Ephrata Fair

Content audits (in conjuction with content inventories) organize all aspects of a website--different pages, subsections, links, photos...the list goes on.  While the concept of page IDs within a content inventory gave me the idea that websites were well-organized entities where everything falls into its own box, I was proven wrong as soon as I started my first content audit for the Ephrata Fair website.  There are many paths to each page.  This was extremely frustrating at first, trying to fit this into the content audit, but I realized it may be helpful for the user; if they miss the path to a page the first time around, there are always alternate routes to the same location.  While I think this idea of multiple paths to one destination has some valid reasons, the organization of this particular site makes it more hurtful than helpful.

[Reverse] Wireframing: Regional Fair Sites

For my wireframing & content audit assignments, I decided on my hometown's annual street fair as my starting point.  The website wasn't necessarily up to par, pretty simple, though we are a small town that's not exactly on the forefront.  From there, I did wireframes for two similar but bigger events, the LA County Fair and the Minnesota State Fair.  These provided a better design quality and a different organization I thought was more appropriate for today's internet user.  But when it comes down to it, wireframes are about the organization and hierarchy, not the design.

Ephrata Fair

LA County Fair

Minnesota State Fair

When it came down to it, the differences between the Ephrata Fair page & those of the LA County & Minnesota State fairs were not as many as I would have anticipated.  The imagery is bigger and keeps to one main image.  The stark sidebar is eliminated, though the LA County site still hints at one.  A search bar is exclusive to the LA & Minnesota sites, which helps drastically in user experience. Other than that, the bare bones of these sites are not too different.

Flowchart: Critique & Revisions

Above is my printed flowchart with some written critiques.  Suggestions from my peers included lining up the title & the key, switch the type & drop shadow colors in my title, stylizing the arrow to match the title treatment, make sure the arrows in the key are consistent with the arrows in the actual chart, & shrink or abbreviate some of the text to fit the constraints of the boxes.

Other suggestions included lightening the background, changing the shapes in the key from black to light gray, shrinking all text, enlarging arrows to distinguish path taken versus that not, & watching my use of informal language & quotes.

Here is my final flowchart.  Just a few things I revised: arrows are more stylized, some text is smaller to lessen line tension, the key is labeled & has round edges & refined stylization to match the title, & some wording was revised.

Flowchart: Progress & Completed Project

Here is my completed flow chart for a riding a Lancaster area Red Rose Transit bus, along with a few snippets from my process.  The project was pretty straightforward and quick to complete.  I did spend a decent amount of time though working on my type and illustration, which is an interpretation of the current bus model with the word "BUS" alluding to the rest of the illustration.

Flowchart: Draft

For my flowchart I am doing the process of taking the bus.  I typically ride the bus to work, but to construct this flowchart I took a trip out to Park City and recorded my process and choices along the way.

During class I worked on some pen drafts & then brought it into Illustrator to get my basic skeleton.  Over the weekend I will work on stylizing &/or illustrations.

CSS Zen Site: Final Critique

Today was our final critique for the CSS Zen websites.  The critique was overall positive & a number of good points were made for me to change.  First was the large scroll bar that may pose a problem for viewers with smaller monitors than the design lab's ginormous 24-inch MACs.  Second was to carry the feeling of openness I evoked in my imagery & headers into my body copy by increasing line height and either using a lighter weight of my font or a smaller size.  Third was to stylize my intro as to differentiate from just larger body copy.  And lastly was to switch the link & text colors in the sidebar.

After the critique there was about 15 minutes to make these final changes.  In this time I was able to increase line height in the body & switched 300-weight Lato out for 100-weight, as well as switch my links to white within the sidebar, which I'm hoping doesn't get confused with the white body copy.

Below are the screen shots from a scroll through my revised site.

CSS Zen Site: Final Stretch

It's here!  The final stretch before Thanksgiving break, the final days to work on this website.  This weekend I got a major portion of my site done.  It was a lot of coding, a lot of troubleshooting, but I'm rather pleased that it worked out [mostly] in the end.

The trouble I've been having has been with rogue links, especially my button links at the bottom, which have been refusing to change color in hover state &, as can be seen, that last one is acting a little funky.

The 3 pictures below are screen shots of a scroll through my site, with various links highlighted to display their signal & cue.

Jared, the Monday night lab tech & myself