Jul 20th, 2007 @ Philadelphia, Pennsylvania

World, meet Unami (aka what Sean has been working on for weeks)

What happened?

Remember back when when I said I wasnt getting that Web site I hoped for?

I was only half right. To recap, me and three other interns were in charge of building a Web site. We had a grand scheme for all kind of features that basically boiled down to two catagories: Networking (user profies, comments, etc) and presentation (layout, images, etc).

We sought to build the site on some sort of Content Management System and we evaluated our options which all fell through. This when I made the aforementioned post. After licking our wounds we decided to just suck it up and do it ourselves.

From there I took designs given to me by one of the other interns and hand coded an entire news site from scratch. CMS be damned.

Thus Unami was born

What is so diferent about Unami?

Mainly the article page. Take a look below (you might have to click):

As you can see the article page allows for several layers of digesting the story. The top layer allows the reader to skim just the hed, sub hed, and the story highlights. If that interests the reader they can continue down into the article page.

The box next to the art lists all aspects of the story upfront. The multimedia is listed in bullet points so if the reader is not in the mood to read, they can cherry pick the video. There are also relevant links, because after all, this IS the internet.

The article is separated into tabs so the reader can pick and choose the part of the article they feel is the most interesting/relevant. Of course, at the bottom of each tab there is navigation so if the reader wants to read it in the traditional fashion they can. Within the article we also inked via lightbox the videos and pictures so the reader is not interrupted when they read the story (Warning: the video lightbox seems not to work on Firefox Macs…Im working on it.)

Essentially the crux of the storytelling is choice. The reader can chose what they want to read in a non-linear fashion. We try to visibly separate each aspect of the story much like a newspaper article would with sub heds within the story. We try to be very visual playing heavy on pictures and videos.

Is it perfect? No. But its a testing ground for some of the theories on young readers. Do they read long stories? Do they prefer a video to text? Do they just skim?

The Tech Side

While I have dabbled in HTML and CSS I have never done anything to this scale. I also know absolutely no javascript and only a little bit of Flash. I relied heavily on free tools such as Lightbox, Tabifier, and JS-kit comments. I can’t emphasize enough how grateful I am that these people put out their work for free. I also used the very cheap monoslideshow for the Flash rotator.

I took the easy route and did the whole site in tables. While I did have a working CSS-built article page, it rendered too differently in various browsers (Alas, my CSS skills are still a work in progress).

The worst part about the page is that I have to enter every article in by hand. I have to FTP all of the pictures and copy the URLS. It really makes you miss a WordPress or a College Publisher.

That’s it!

So, there you have it. Be sure to let me know what you think in the comments. Constructive criticism encouraged! (Sorry for all the spelling errors, I typed this in a hurry)

Discuss this post on Twitter.

Signup for Sean's newsletter. No spam, sent very sparingly.



Back home