Blackboard redesign, version 0.1

It took a couple of hours, but I feel much better having done it. Sometimes I get ideas in my head and the only way to get them out is to make them. I propose a ton of new things here, but I’ll have to explain them fully later on. I’ve created a tag for this line of thought and will post related items there.

 

Designer == Coder

lots of folks have been talking about how designers need to learn how to code. i agree, but also: should developers learn design principles?

There should always be a little cross-training in every industry. It improves communication and mutual respect. A serious UI/UX designer isn’t trying to just make something “pretty.” More like, “pretty awesome.” (Heh!) But experts should be left to do what they do best: design experiences or code the backend. Very few can do both equally well. One of the complications is that on the web, there are no decent design tools. On the Web, design is CSS. The code is the design control. Instead of a paint bucket with red as the color, you have to create or specify an HTML object and give it this property:

background: #c00000;

And in order to “paint” on an HTML canvas, a designer needs to know some code to get it done. I don’t think anyone should expect a UX designer to code advanced queries and JavaScript. But he should be able to clearly describe the user’s needs and expectations, and understand the capabilities and limitations of every technology — just as an established print designer knows some paper types have better color reproduction than others.

When I interned at the Naples Daily News in 2006, I designed newspaper layouts as a copy editor. The layout software we used was code-based. Every headline, byline, photo caption and article text had to be set with special codes not unlike HTML. I had an epiphany later on, thinking back on this experience while I was dabbling in advanced CSS: Programs like QuarkXPress and InDesign merely removed the coding aspect from design. It replaced markup with buttons and toolboxes.

Today, when I “design” a website, I often think in desktop-publishing terms: image boxes, text boxes, headlines, paragraph styles, all of which have either CSS or HTML equivalents. A “div” for example can be practically anything, either a text or an image frame, depending on the CSS. Similarly, when I draw a box in InDesign, almost anything I can imagine can be placed inside of it. Because I understand how a CMS works, I can also imagine divs and other objects as “placeholders” for dynamic data, like a list of headlines.

It is therefore not hard to imagine better design tools built for the web that are as powerful as InDesign is for print. In fact, Adobe Muse strives to offer this very thing. All it’s missing is the ability to integrate with content management systems, which can’t be too far away. After all, InDesign itself has XML import/export capabilities and can do simple data-driven documents out of the box (a glorified mail-merge), but even more is possible with InDesign plugins.

In other words, someday soon, designers can get back to strictly designing* and coders back to coding.

*Of course, another roadblock is browser compliance with HTML and CSS specifications. Browsers need to be as predictable as a PDF reader. A document creator should be able to use standard tools and create something that he is reasonably certain will be represented the same way across all browsers, operating systems and devices, just like today’s PDFs.

Focus on the task at hand

Keeping a sharp mental focus is a difficult task in the connected world; but perhaps it always has been.

Right now I should be doing homework, but I must first strongly resist the urge to start coding up a fix to one of my web projects or dabbling in some new trick. I like that code can be like poetry. It gives expression to ideas; nothing deep or dramatic, but simple, clear ideas that help the communication process.

Weird that my principal distraction isn’t music, games or movies, but code.

E-learning still has a long way to go

One week into my studies at U-M’s online master’s program, and I can tell that e-learning has a long way to go. I don’t think it’s the fault of the professors, but the systems they’re given.

We use Blackboard, which is surely a robust system that seems to do an adequate job at handling different kinds of learning modes. It has certainly come a long way since its days as WebCT. But I still feel like I’m using a website designed in 2002. Framesets, seriously? And all kinds of Java, which always seems slow and buggy to me.

For a user who is accustomed to the ease of navigating Facebook, Twitter and numerous iPhone apps, Blackboard is just plain ugly and awkward. For someone who appreciates simple, unobtrusive design, it’s a chore to use. Granted, it is clearly a product that has collected a lot of functionality over the years — a compliment to its apparent flexibility — but lacks the finesse that comes with a product that was designed on purpose.

A better web learning system would integrate webinar-style lectures and interactions, collaborative writeboards and other teamwork tools, integrated file sharing, a user directory with avatars, chat (show me if any other classmates are online), integrated calendar and RSS feeds, private messaging, live notifications and other features that make me addicted to it the way I’m addicted to checking my Facebook. In other words, look at every successful feature of social networks, and design them for a learning environment, which are essentially the same as “groups” with a leader/moderator.

If the Blackboard system I’m using now offers any of those features, they are not obvious. (Another design flaw.)

Of course, I am only seeing half of the end-user experience. I’m sure the teacher/admin side isn’t pretty, either.

If I get in the right mood, maybe I’ll whip up a quick wireframe on what Blackboard could look like if it got some real design direction.

 

Back to school

After four years since my undergrad career ended, quite satisfyingly, I am entering graduate studies at the University of Missouri-Columbia today.

This is the realization of a sort of dream I’ve had since high school, when my journalism teacher at the time described how wonderful the school was and how it cultivated great journalists.

I am nervous and woefully out of practice when it comes to academic work. The media management program is entirely online, which will be a new experience for me, even though I suppose I am part of that generation of those who grew up online. Perhaps the oldest edge of that generation. I grew up with dial-up, not broadband, after all.

Meanwhile, my students are coming back to school today as well, going to class and getting to work on running the University’s daily newspaper, keeping up an important, if misunderstood, tradition.

One thing I hope to come to understand in grad school is how to create the best student media program possible. Not many folks are into this sort of thing, and it doesn’t make for interesting dinner conversation. But I consider it vital to the future of journalism, both its study and practice. More thought should be put into college media. It seems silly that so much money goes into college football, which, I’ll admit, is awfully entertaining, but isn’t intended to develop and support one of the critical aspects of our republic.

To my students, and myself: good luck this year. Be kind and work hard.

A hack job toward single-post exporting

I spoke too soon. Somebody already wrote a plugin that lets you export a single post into an InDesign-friendly format: tagged text, no less.

So, of course, when I came across it my immediate desire was to hack it up and see what I could make it do.

First was to see how I could manipulate the InDesign tags to fit the stylesheets we have in place at The Daily Cougar. Easily accomplished by exporting a complete story (headline, cutline, etc., included) into tagged-text and looking at the guts of it.

This got to be pretty interesting, so I went on a tangent, and realized I could access all of the WordPress functions available through the loop. That meant I could export the headline (the_title) and category (get_the_category) fairly easily. The trick would be writing some simple functions to fetch our custom-field driven subheadline and bylines. And the icing on the cake would be to grab the cutline from the first image attachment of the article.

So, long story short, I’ve got a workable web-to-print workflow piece, customized for our environment and ready for testing in the wild.

Next up: hack the plugin’s “Print post” function to generate a clean XML document that could be imported into any page layout program. If it seems worthwhile, maybe I’ll offer it up to the plugin authors as a new feature.

Man, I’m a huge nerd.

I want: Single post XML export in WordPress

I want to be able to hit a button inside the WordPress post editor that says “Get post XML” and download just that post’s XML for importing into InDesign. Or hell, give me the ability to export Doc, RTF, PDF and any other basic text format. Give me data portability, WordPress!

Do that and you’ll have a free, open-source alternative to Google Docs.

If I were a competent programmer, I’d do it myself.