Not all sunshine and roses


I had a great time at SNDBoston, and I learned a lot. Unfortunately, one of those things made me really sad.

Friday night, SND goers were bused over to a club in the Theatre District, Felt. Somehow, three floors of pool tables and dancing space were reserved just for us.

After milling around to see if anyone I knew (from the blogosphere or otherwise) was there, I settled into a conversation with a couple of older journos hanging out in the back. One of them was very receptive to my explanations and enthusiasm about online journalism. But the other kept asking me, “So, you want to be a tech?”

After some probing, I discovered that a “tech” is someone who shovels content onto the Web site. Ugh.

It came as a surprise, surrounded as I am at school by people who “get it,” or are trying to, that my geeky tendencies would relegate me to something so distasteful. My reporting skills are fine, I just happen to enjoy coding as much as I do writing.

SNDBoston: Making Data Webby


with Adrian Holovaty! This is the highlight for me, since my background is more programming and I’m defenitely a huge geek. Seeing Adrian speak was the deciding factor in coming to SND.

How to take data and make it efficient in terms of how the hypertext is laid out. Example: Wikipedia = Serendipity

Journalists are essentially collectors of data.

Rant #1 No serendipity in online journalism. Bullshit!
Data browseability: people want it and expect it. (IMDB, Amazon.com)

Serendipity increases stickiness and usefulness.

It all starts with structure. Have a structured list of data (facts) like an Excel spreadsheet. Journalists take clean data and turn it into a story. Computer programs can’t read the story. News orgs have the infrastructure to collect data, edit and verify the data and get the data to people. But they don’t leverage the data!

Lesson #1 Structure your data
Everything has structure. Sports. Obits. Even photos: subject, photographer, where, when, camera, size, colors (Flickr)

After the structure, the easy part.

Lesson #2 Give your data “the treatment”
Example: crime data
Step 1: lists fields (date, time, type, address, location, arrests, case number)
Step 2: key concepts (what data is useful? date, time, type, address, location)
Step 3: make breakdowns (list all possible values for each field)
Step 4: make list pages (pages for each value in each field)
Step 5: detail pages (pages for each crime)

Things to note
- Permalinks for concepts (distinct URL) linkability/bookmarkability
- SEO
- Serendipity

Example sites: chicagocrime.org, Faces of the Fallen, Video Game Reviews, Mixed Messages.

SNDBoston: Storytelling in Print and Multimedia


Kelli Sullivan from the Los Angeles Times and Jenn Crandall of onBeing from the Washington Post.

Tell stories with graphics (example: show how trailer sways occur, graphics in print, flash online; break stories up into sections for layout)
- instead of scattered graphics, use sequentially to tell story
- figure out goals of editors and find creative ways to achieve them
- work closely with photo editors
- keep communication flowing: make sure you have the space you need, communicate with Web people as you learn things

Edit ruthlessly: edit for redundancy, keep it simple, let photos help pace the story
Build on the unique aspects of the story
Are graphics accessible, do they forward the story?
Develop multiple versions if there is time
Can breaking design rules help the project?

Solicit feedback!! But maintain independence/objectivity.

Jenn Crandall is freaked out by not being a designer, too! She’s a still photographer and videographer.
Oh yes! My favorite OnBeing character, Gio Escalante. Cute little kids for the win.
Focus on the characters: clean design, make it all about the person.
Lots of questions about this project: editing, equipment, traffic and response, transfer to print (there is currently not a print version).

I’m beginning to understand and appreciate the “these are my designs” trend. I think it depends on how the lecturer explains the design. Thinking about how to take some of this layout stuff online. Also, how to work more closely with various editors to anticipate online projects. onBeing is a perfect example that newspapers need to provide more than what we normally define as news.

SNDBoston: The Future is Now


with Nick Bilton and Michael Rogers from the New York Times R&D team.
R&D: Engineers look ahead (18 months to 5 years) for new technological advances. R&D is a state of mind and a commitment of resources.
“I always wear a tie because with a title like ‘futurist’ you need all the credibility you can get.”

How will content be delivered?
- Paper is hard to compete with as a display device.
- E-Ink: flexible, long battery life, no energy to display page, can hold 180 books, only black and white
- Polymer vision: about the size of a cell phone, updates wirelessly
- OLED: OLED screen is vibrant, great with color
- Google vision

The next audience: Millennials
Fears: a) no interest in news, b) no interest in paper
Were you seriously following the news at age 17? College students read campus news on paper: its still convenient.
Millennials have no habits that revolve around news. They have mobile phones!

Wireless everywhere!
- WIFI: laptops shipped with it
- 3G
- WIMAX: wifi on steroids, global standard

Devices?
Laptops will get smaller, smartphones get better, until they merge. Times Reader: Windows-only right now. Navigate, resize, edit and annotate text, send annotations to others. Lays itself out to fit size of screen.

Print to Mobile
- Reefers
- Interact with paper via text messages
- 2d barcodes for cellphones to Web site
- shifd.com: communication between phone and TV, phone and computer

Devices are becoming more aware of our location and the content we seek. More and more data comes in automagically tagged with extra info (Geotagging).
How do we create new value out of existing content without expending human effort? (Algorithms, Google Earth!)

Virtual News Delivery: SecondLife

SNDBoston: Multimedia, The Next Frontier


Brian Storm, founder of MediaStorm.

Bloodline: AIDS and family by Kristen Ashburn and Kinglsey’s Crossing by Olivier Jobard - good photojournalism can transate into cinematic (web) space, blending video, audio, text slides, infographics and photos.

Storm also showed the “Creep” Flash animation for Radiohead, an animated collage of life in Cuba, and, of course, Ivory Wars (in collaboration with National Geographic).

Newspapers think that video can save them, but photography is still a powerful medium. So get audio. Do audioslideshows.

Storm doesn’t believe in the “2-3 minute YouTube rule.”

Production and distribution costs are affordable and simple.

MediaStorm aggregates a bunch of different types of media, they are sponsored by The Washington Post, uses Brightcove for playback, relies on viral products (music, photos, video, books, podcasts etc), “reducing the friction.”

Can license projects to clients to premire content, media companies can bid. Media companies can also hire MediaStorm to produce specific content.

SNDBoston: Elections Roundtable


Coverng elections is a serious design challenge: fairness, impartiality, dense content, BORING?! Designers can make the content interesting and visually appealing.

Paul Nelson, The virginia Pilot

- Work with ad vertising to ensure enough space
- Handle news based on value and not on previous coverage
- Get opinions from community (reaction pieces on debates, etc.)
- Create ways to make the good stuff stand out (local connections to issues, adwatch - are candidates telling the truth in ads?)
- At-a-glance info
- Jon Stewart and Stephen Colbert
- illustrations, graphics, multimedia, embed from YouTube etc.
_ reefers to Web site
_ prepare multiple fronts

Dan Wasserman, Boston Globe

- Cartoons for election campaigns: has to fill the same size rectangle 4-5 times a week.

Eilliott Malkin, information architect, New York Times interactive

- 2004 election coverage: infographic reefer, liva data from AP
- 2006 coverage: modular inforgraphics, came up with structure 6 months in advance: results page for each section
- 2007: blog caucus, full column infographics, live data, results by various categories
- 2008: homepage, politics section front, blogs, election guide (evergreen), topic pages via nyt navigation and google searches (SEO), timelines

SNDBoston: Brainstorming Session: Design


Robert Newman (Resource Guides on the site) and Kate Elazegui present examples and tips for fresh design.

This may be because I’m not a designer, but I’m really confused by the constant “These are the designs I’ve done” thing. Yes, we learn by looking at other people’s work, we get ideas from other work, but I really don’t feel like I’m getting much out of this. Also, brainstorming to me means we present a challenge or problem and toss around possible solutions. Does going back through your portfolio and telling me about your thought processes count?

- Collect illustrations and layouts you like to look at while brainstorming.

- Functionality and practicality over beautiful design

I left this session 30 minutes early and wandered over to the exhibits. Found some cool things I’ll write about after lunch.

SNDBoston: Chip Kidd


Clue: a number of people, 19 across, eleven letters

advice: teach yourself how to write, learn how to do crossword puzzles

design of comic book covers: BOUNDARIES! gay superman, robin kicking batman in the crotch

Forget the preconception of what a best-selling book might look like.

Typography 101: Make the word look like what it says. What happens when you turn this the other way around? Avoid literal representations. Try to work elements from life into your work.

Sometimes the light just goes off, even if its a stupid book. Book jackets can only do so much.

Kidd is freaking hilarious.

Answer: Anaesthesia.

Student Sessions: Your Online Publication


Jared Novack and Mike Swartz talking about taking a print publication online.

“How to make an extra $10,000 at your first job and not get laid off 3 years later” is the title of their presentation.

First step is to establish a Web identity. Look at the flags from established, important newspapers and then check out their online representations. Ew. You already have a print identity. Use the same logo, carry your brand over isntead of creating a new one.

WEB DESIGN IS NOT PRINT DESIGN ON A COMPUTER. amen.

Remember:
hierarchy content placement
teasers and reefers more important
columns and grids
design fundamentals
ads are content too
scannability (provide a buffet of info..I’m hungry!)

Forget:
large amounts of real-estate
large amounts of copy
overdesigned logos

Design it once: modular design

Online typography: Only a few typefaces to work with. Make the best of it with CSS. Check out A List Apart. Typography is what users interact with most on your Web site.

Three tips:
Play with letter-spacing
Play with line-height (approx 130% of font size)
Use font size for hierarchy

Newspaper Sins:
Flashturbation: Hell to make and update, hell to link. But, Flash can do the work for templated packages.
Blog Jammin’: Why are so many newspaper Web sites inundated with blogs? Rife with: non-information, uninteresting and mundane, not current or neglected, leftover stories. When they are extremely targeted, have organized information and are used as an easy portal to content, they can be good. Good idea: crime blog.
Podcasts: enhance content by providing a primary source, don’t just read the headlines.
Video: YOU ARE NOT TV and that’s a good thing.

Use Google Analytics. Use SEO.

Student Sessions: Typography


David Berlow, founder of The Font Bureau, which produes typefaces for newspapers like the Chicago Tribune and Wall Street Journal.

Fonts tell about who and what you are. (smaller lighter type for younger audiences, bigger, heavier type for older)

Critical: Don’t lose touch with your audience, keep line and letter spacing under control.

Big problems: Too much whitespace (WHAT?! I don’t think I’ve seen too much whitespace on a newspaper site…)

My battery is about to die and the power cord is upstairs. More later.

UPDATE:

Advice: the right side of the letter indicates what letter it is, so focus on that. repeat shapes throughout one typeface.