Before you get all huffy, this is not to say by any means that I think anything goes in design. Seeing the font comic sans on anything other than a greeting card makes me want to puke, and working with Web sites laid out entirely with tables makes me die a little on the inside. I agree that there should be rules and standards. Cyberspace would be a scary, chaotic place if everybody did his/her own thing and there were no conventions to live by. However. Rather than stopping at that well-worn sentiment “you have to know the rules before breaking them,” I would add, don’t be afraid to break the rules, as long as you have good reason to do so. What’s a good reason? As usability expert Steve Krug says, “it depends.”

Krug’s book Don’t Make Me Think argues that the only absolute rule in Web design should be to not make the user have to think in order to use your Web site. With that in mind, consider this. One of the first Nevers I learned in Web design was: Never say ‘click here’. One day I was working on updating a site that somebody made 5 years or so ago, full of table layouts and ‘click here’s. As I sat there trying to re-structure sentences to get rid of the ‘click here’ I began wondering, if the goal is to make it obvious where to click, isn’t ‘click here’ the ultimate signal of where to click? I’m definitely not saying that I want to see a Web cluttered with ‘click here’s. Nobody wants that. So, since we would like our users to think just a little bit, in that respect at least, maybe even “don’t make me think” shouldn’t be considered an absolute rule.

Some things work, and others don’t. But it really all depends. It depends on the project, on the content, on the context, etc. Design is not an exact science at all, and as soon as you can accept that and transcend the world of Never and Don’t, the possibilities become endless. This isn’t algebra. There’s no such thing as Never.

For quite a while now, I have been feeling frustrated with how the journalism courses I sign up for end up playing out. In electronic photojournalism last semester, I often felt that I actually knew more about the software the instructor was teaching than he did (mostly because of the teach-yourself online classes I’d taken – outside the j-school). It promised to teach me the best ways to present my multimedia projects on the Web, but aside from project critiques, I didn’t feel like the teacher brought any expertise or new information to the table. My last few convergence classes, while very useful in practicing multimedia storytelling, video editing and project management, were set up more like jobs than classes – with instructors acting as supervisors rather than instructors. This is fine, and I understand that it is part of what the “hands-on learning experience” that Mizzou is known for is all about, but I would just as soon have these experiences as internships instead, and not be paying thousands of dollars a year for them.

I think that a large part of the problem is that things are changing so quickly that nobody really knows how the industry is going to look from one day to the next. New technologies come out as quickly as we can learn them, and some of the brightest minds in the world are constantly trying to come up with new ways to apply them to “save journalism.” Some work for a while, others end up being a huge waste of money and effort. Our teachers, instead of giving us the answers about how to succeed, are looking to US for the solutions. I can’t count how many times a teacher shows us something new and says “Alright, so what does this mean for journalism?” The room falls silent for a few minutes as we all shrug our shoulders and look gloomy, and half the time I just want to shout, “We don’t know! You tell us! Please!” Somebody eventually speaks up with a half-conceived idea that’s really just a guess. The truth is, though, we’re getting into areas that are uncharted even for our experienced faculty, and often our guesses as students are pretty much as good as theirs.

Maybe it used to be that you could go to school and learn how to write and report, then count on a few years of hard work before solidifying a decent position, working your way up the corporate ladder, eventually paying off your student loans, mortgage, etc. I don’t think that is possible for anyone any more, but especially not for journalists. All of us, whether fresh out of school or with a few years of work under our belts, have to constantly rely on what we can teach ourselves and how we can adapt our ways to new developments. The formal education system just isn’t equipped to prepare us for this. You may graduate ready to be the best at what you do, but in a few weeks/months/years, what you do may very well be obsolete. It’s sink or swim, with no certainties and no room for complacency. Frankly, it’s terrifying. But I’m done wasting my time and money waiting for someone else to hand me the answers.

The most recent addition to the site is the multimedia gallery. I was originally planning on building it in Flash, but then Flash Catalyst came out and I’ve been hearing so much about it (because my roommate Alex is in the RJI Interaction Design competition, which is based around the program’s beta release) that I decided this might be a good opportunity to try it out.

Basically, the advantages of Catalyst as I understood it are that 1) you don’t have to write any Action Script to make things interactive, and 2) you can import projects drawn in Photoshop or Illustrator, with all of their layers and components intact.

Overall, I was disappointed. I know the program is only in its beta release, but I was using it for something pretty basic — way, way below the level of what Adobe claims it is able to accomplish — and still, it ran so incredibly slow that any time I might have saved by  not having to mess with Action Script was lost several times over on waiting for the program to unfreeze, even after doing something as simple as switching from the arrow tool to text tool.

Also, the ability to import Photoshop and Illustrator design projects is great, but I actually quite like Flash’s drawing tools, and poor old .FLAs don’t get the same privilege! Catalyst itself has next to nothing in the way of drawing tools – pretty much just straight lines, a few basic shapes or text.

The worst frustrations for me was when Catalyst claimed to be able to import .SWF files, but the program crashed every time I tried to do so. I was trying to import a slideshow using the Flash/Soundslides component, which uses Actionscript 2 instead of 3, so my best guess is that Catalyst is just too cutting edge for such archaic technology.

Anyway, despite my disappointments and frustrations, Catalyst and I ended up getting along in the end, and I’m happy with the way the gallery turned out. I won’t give up on it yet, but I do hope that some significant improvements will be made for the official release – if only in how smoothly it runs. I never again want to spend as much time staring at that Pinwheel of Doom as I did last night.

Why I am a fan

First, let me say that I think this is definitely a step in the right direction. Of course people read differently online than on paper, and it’s great that the Missourian is acknowledging that and attempting to adapt. More news websites should do the same. People have much shorter attention spans when they have the whole Internet at their fingertips. Right now, I have nine tabs open in my browser and every few sentences I’ll take a break from writing to switch over to another one. I did the same thing while reading the Slate article, and I’ve gotten about halfway through Nielsen’s since starting this blog entry.

When switching back and forth beween tasks like I do, subheadings are very helpful in finding my place or skipping down to the part I’m interested in. In news articles, it’s nice because I can quickly skim the headings and see where the article is going before I commit to reading the whole thing. I’ve seen this done mostly in long-form stories before.

The occasional bold sentence/word is nice as well, as a way of emphasizing a key point. Nielsen says this aids scanning, and I agree, but for me it also serves the purpose of occasionally pulling me out of my web-reading daze and making me pay special attention for a second. When you sit in front of a computer for most of your day, all the blocks of text tend to start running together and it’s hard to retain the important bits. Wake me out of that daze every now and then, and I will #1 be more likely to finish the article, and #2 probably remember more about it.

This is already getting a little long according to Nielsen’s standards, so I will move on.

Why I may not be so much of a fan

I think these principles taken to an extreme, as in the Slate article, can actually have the reverse effect and make it harder to read and keep my attention. Delivering content in bite-sized paragraphs and lists is fine, but you also run the risk of people taking a nibble then leaving without getting to the good stuff. Also, bolded words scattered all over the place frankly looks like crap, and when I see too many links it makes my head spin with all the different tangents I could go off on.

As I understand it, the Missourian plans to use this format for short news stories like this one. That’s fine, and I think the idea is to make stories like city council meetings less mind-numbingly dull to read. Still, I think these design principles would also be useful in helping a reader get through a longer story. I’m certainly not saying that long-form narrative features should be crammed into the same template as news briefs, but they could probably still benefit from some subheads. And bold sentences could function kind of like the pull-quotes you see in print (magazine mostly).

Anyway, I’m interested to see how this works out for the Missourian and if they decide to make it a permanent change.

The opening page starts out strong, with a overview video placed over an image of movie theater seats, making it look like the video is playing on the movie screen. Very creative. The seats remain constant throughout the presentation, so the content is always displayed on the “screen.” My only complaint is that there is no progress bar on the video on this page – not knowing how much longer the video tends to make me get bored and click out early. The next section focuses in on the theaters themselves and has a map where you click on a theater to watch a video and read a little about it. After watching the video, you can either close out and go back to the map, or just click on a “previous” or “next” button to go straight to the next theater on the list. The only problem with this is that if you don’t finish or pause one video before going on to the next, it keeps on playing in the background so you can potentially be still hearing the audio from the last video while you’re trying to watch the next one. Also, the embedded Google map that people can submit screenings to  is a good idea, but it didn’t work very well for me when I tried to use it.

The timeline in the History section is probably my favorite. It starts out with vertical title bars for each decade, separated by photos of the same shape and size. When you mouse over a decade, it expands and the rest contract to just the title bars, and you can read about your chosen decade and watch a short video. I thought this was a very good use of Flash — timelines can be boring and/or cluttered a lot of the time, but this one was neither.

I also like the setup of the final section, “Programming.” It has four points to make, and very clearly names and describes each one in the top half of the screen. When you click on each one it displays a video or two in the bottom half with simple face-to-face interviews talking about that point. It’s simple and easy to navigate, but still very clean and visually appealing. Overall, awesome multimedia presentation. Awards were well-deserved.

When I first looked at the story on Thursday afternoon, there was a flash slideshow at the top with a couple of photos and an interactive map showing where the shooting took place. The map really didn’t need to be interactive, as there was only one location, but since the story was still unfolding at that point, it was probably a good thing that they were ready just in case things got more complicated. Below that was the text story, and a little further down a few video interviews and a timeline graphic. Not too shabby for a few hours after the shooting. Now, the next day, there are more photos included in the slide show and the map is gone.

I particularly like the way the videos are embedded in the page. They start out thumbnail-sized and off to the left, but when you click on one it expands across the main column to a pretty decent size – about the same as the slideshow above. The best part is that the text just re-wraps around it. No extra window, no external link, hardly any lag time. The multimedia components are not treated as afterthoughts, but as an integral part of the story. I seriously would love to figure out how to do this myself. The only thing I would have done differently with the design of the page would be to move the videos up a few hundred pixels to eliminate some of that white space in the top of the left sidebar.

Handmade paper casts by Mary Samboethe - click to watch the audio slide show that took me much longer than necessary to create.

Granted, this was my first attempt, so I was less than efficient. And there was a point when the program would crash every time I tried to import my audio file. But what was most frustrating to me was how difficult it was to change the order of my photos or replace them with new ones. Sure, there is a “swap symbol” option, but each image has a several keyframes (for transitions) and you have to do that for each one. There has to be a better way of doing this than we were taught in EPJ class, and I am going to figure it out.

In the meantime, there is a Soundslides component for Flash that allows you to use a lot of the functionality of the program, but customize the appearance of the player. I have not used this very extensively yet – only a quick demo in class – but I will investigate and get back to you with pros and cons.

Ol’ Soundslides may be ugly. And yes, it may be limiting at times. But by golly, be grateful because it does all of the tedious bits  and the hard parts (ahem, actionscripting) for you.

This weekend, Alex and I are covering the Citizen Jane film festival, a local film festival hosted by Stephens College and Ragtag, focusing on the theme of women in film. This is the second year it has taken place. Bluebird music and arts festival is also going on this weekend, but because of personnel shortage we had to choose one, and film is something that is normally more difficult to cover from a local perspective. We’ll each be attending films and Q&As with directors, and I’m also hoping to make a video or two.

As for the next local band feature, I’ve contacted Bockman and they’ve agreed to be our next subject. They are playing a show (for Bluebird actually) at Mojo’s Saturday night, and if I’m not doing anything for Citizen Jane at the time I’ll go shoot video of that, then line up an interview sometime next week.

Coming up, we’ve got a Columbia now-and-then photo story with some old yearbook photos that Alex got her hands on from the early 1900s. Also, a long-overdue Broadway Brewery story should be coming in soon from one of our contributing reporters, and I’d like us to do a piece on Cafe Berlin’s new location when it opens.

We really need to get started on our research soon as well, so hopefully within the next week we’ll have written the survey and start figuring out how we will distribute it. No real progress so far on figuring out how to keep the site going after we all graduate, but we’re working on that.

The main problem with Flash is that it’s not compatible with the one thing that everyone is concerned with these days: search engine optimization. It may be perfect for building a beautiful showcase for your work but that’s no good to you if nobody can find it, right? I can agree to a certain point – it’s problematic if your entire website is Flash and there is no search-able text on it whatsoever. But can it really be that harmful to your SEO if you use Flash players for your videos, slideshows and galleries? You can always include a paragraph of supporting text, and perhaps a list of tags on the page outside the Flash player, and at least they are be visible to search engines.

Photographers can perhaps get around using Flash pretty easily, by just using HTML and action scripting instead. You can still make perfectly functional galleries and slideshows that way, it’s just a lot more limited on the design front (example). And to make it do exactly what you want, you have to know the boggling intricacies of Javascript pretty well. We multimedia journalists, though, also need a way to showcase our video and audio. Part of the reason Flash is so attractive to people like me is because it makes it easy to combine all of these elements, and make them look and interact exactly as we want them to. I recently stumbled across this video player that uses a new HTML <video> tag. While this is undoubtedly useful, since it eliminates the need for embedding a Flash player, it’s not widely supported yet (only in newer versions of Firefox it looks like), and I assume it still doesn’t allow you much control over the appearance of the player. I intend to give it a try though, so I’ll let you know how that turns out.

The Sportsshooter article referenced above offers two solutions that photographers are using to create portfolios that are both attractive and SEO-friendly. One of them is liveBooks, which creates a “shadow” HTML version of the site that search engines can index, but users only see the Flash version. The other is approach is adapting the site into semi-blog form using WordPress. There are entire companies devoted to designing WordPress themes ideal for photographers. With I Know CoMo, I’ve found that it’s not as easy as it may seem to do this on your own. Anyway, while interesting, both of these options cost money so they are not ideal for me right now.

Honestly, I still think I will use Flash for my portfolio site. I’m not aiming to be a freelance photographer and sell any of my photos from it, I just want to be able to easily show potential employers what I’m capable of. Most of the people who I want to see it will be directed straight there from my resume or a cover letter. And I really only need it to show up on the first page of results when someone is Googling my name. And for now, I would much rather design my own media players than spend time slogging through somebody else’s code to make it do what I want it to.

The front page has one large photo, which changes every five seconds or so. Navigation is across the top, and a short bio to the right of the photo, Zoeller’s logo as  a light watermark behind it. The logo is included on every page throughout the site, which is obviously good for branding.

I think the galleries on Zoeller’s site are very well put together. The layout is clean and the photos large and high-resolution. This makes for slightly longer load time, but the photos are so beautiful that as I was browsing, I felt they were worth the wait. Also, he included a pre-loader icon, so I could watch the progress as the next photo loaded, which helps with the impatience factor.

There were only two things I don’t like about the setup of the flash galleries. First, the transition between photos is very smooth and lovely, but they slide in from the opposite direction that I expect which is a little disorienting. When I move along the row of thumbnails from left to right, the large photo also slides from left to right. It’s hard to explain, but the way my eye naturally moves, when I click on a thumbnail to the right of the one I’m looking at now, I expect that photo to move into my view from the right as well. Look at the iTunes “cover flow” view if you don’t see what I mean – that feels more natural than Zoeller’s gallery. So I would probably just reverse the direction the the photos slide in from on the transitions. Second, there is a thumbnail photo that pops up when I mouse over the images in the row of thumbnails. It is no bigger than the thumbnail that I’m already looking at, so I think it’s a bit superfluous.

The only other thing I would comment on is the fact that the navigation moves from the top of the page to the left on the gallery pages. It doesn’t really bother me though, and makes sense because it allows the photo to be larger, and balances out the gallery navigation across the bottom.