In typical Just Tadlock fashion, he has written and published another in-depth tutorial that covers User Taxonomies. The tutorial is not for the faint of heart as it requires that you know how a few sections of WordPress work such as plugins, themes, users, and the taxonomies themselves. Just imagine how awesome the Codex would be if Justin wrote the entire thing!

Related posts:Help Justin Tadlock Develop A User Management Plugin
Justin Tadlock On Creating Custom bbPress Views
A Theme I Can Be Critical About

Comments

Comments

In Uganda, where many lack access to the Internet, people can engage with local radio stations to make informed choices and hold their leaders accountable. Using SMS and a new tool, TRAC FM, listeners can respond to poll questions such as: What service delivery should be a priority: health care, education, security, sanitation or transport?

TRAC FM was the focus of a larger case study we did for the Mobile Media Toolkit. The Mobile Media Toolkit is a project of MobileActive.org. The Toolkit provides how-to guides, wireless tools, and case studies on how mobile phones can (and are) being used for reporting, news broadcasting, and citizen media.

The TRAC FM software plots SMS responses to questions poised during radio programs. The responses are condensed in data visualizations, including bar graphs, time graphs, and maps, so that radio presenters can get an overview of where reports are coming from and what the issues are.

But, in Uganda, radio stations generally do not have websites, so sharing the visualizations with their audience requires a little more creativity. What stations do often have is an Internet connection to download audio files they use for advertisements from companies like MTN.

How data visualizations help

So radio presenters log into the TRAC FM system through their Internet connection in the studio and share the poll results with listeners during their talk show. The data visualization overviews may offer more substance, as they are the aggregation of an entire audience and not just an individual opinion. The data visualization for the public service delivery question, for example, showed that 65 percent of respondents thought health care was the top priority.

To learn more about how they did this, read the full case study at the Mobile Media Toolkit.

The Mobile Media Toolkit is a collection of resources, guides, case studies, and mobile tool reviews to help you make sense of mobile media. From creating and editing audio and video content on your handset, to delivering content to mobile audiences, to engaging with listeners and readers via mobile, it's a one-stop shop on Making Media Mobile. We launched this summer and have been adding great new content and case studies, in English, Spanish, and Arabic. We now have a few pages available in Russian, too, with more to come.

Stop on by to see what we're up to. Find us on Facebook, follow us on Twitter, or reach out to us here to submit your own stories from the field or alert us to great new mobile media tools.

Comments

WordCamp Cape Town took place last month at the iconic V&A Waterfront with Table Mountain as the backdrop. 6 of the WooThemes team members were representing and engaging with WordPress & WooThemes users.

Highlights
Below is a short 2 minute video of the day’s activities. WordCamp was slickly & professionally organised by Ashley Shaw of LightSpeed. Ashley also happens to be one of our most advanced Canvas theme users, check out his portfolio for some incredible mods!

Using WordPress as a development framework
Using WordPress as a development framework aims to alleviate the overhead associated with common activities performed in Web development. WordPress gives you a base set of application functionality such as user management, routing, caching, that you don’t need to build from scratch.

This session will show you how easy it is to implement a public frontend, backend, and admin area for users, as well as a basic API and other advanced functions.

The Business of WordPress: Making Money in more ways than one
WordPress has grown into a very diverse ecosystem, where its users have cultivated multiple different opportunities to create & build a business. Commercial themes have been the most obvious / mainstream success, but beyond theming there’s still so many untapped opportunities.

This session briefly explores some of the more untapped opportunities.

See more WordCamp Cape Town talks on the dedicated YouTube channel.

From left to right: Cobus Bester, Byron Rode, Adrian Myburgh, Mark Forrester, Jason Bagley, Adii Pienaar, Charl Norman, Nur Ahmad Furlong.

 



 





WordPress plugins are PHP scripts that alter your website. The changes could be anything from the simplest tweak in the header to a more drastic makeover (such as changing how log-ins work, triggering emails to be sent, and much more).

Whereas themes modify the look of your website, plugins change how it functions. With plugins, you can create custom post types, add new tables to your database to track popular articles, automatically link your contents folder to a “CDN” server such as Amazon S3… you get the picture.

Theme Or Plugin?
If you’ve ever played around with a theme, you’ll know it has a functions.php file, which gives you a lot of power and enables you to build plugin-like functionality into your theme. So, if we have this functions.php file, what’s the point of a plugin? When should we use one, and when should we create our own?

The line here is blurrier than you might think, and the answer will often depend on your needs. If you just want to modify the default length of your posts’ excerpts, you can safely do it in functions.php. If you want something that lets users message each other and become friends on your website, then a plugin would better suit your needs.

The main difference is that a plugin’s functionality persists regardless of what theme you have enabled, whereas any changes you have made in functions.php will stop working once you switch themes. Also, grouping related functionality into a plugin is often more convenient than leaving a mass of code in functions.php.

Creating Our First PlugIn
To create a plugin, all you need to do is create a folder and then create a single file with one line of content. Navigate to the wp-content/plugins folder, and create a new folder named awesomeplugin. Inside this new folder, create a file named awesomeplugin.php. Open the file in a text editor, and paste the following information in it:

<?php
/*
Plugin Name: Awesomeness Creator
Plugin URI: http://my-awesomeness-emporium.com
Description: a plugin to create awesomeness and spread joy
Version: 1.2
Author: Mr. Awesome
Author URI: http://mrtotallyawesome.com
License: GPL2
*/
?>

Of all this information, only the plugin’s name is required. But if you intend to distribute your plugin, you should add as much data as possible.

With that out of the way, you can go into the back end to activate your plugin. That’s all there is to it! Of course, this plugin doesn’t do anything; but strictly speaking, it is an active, functioning plugin.

Structuring PlugIns
When creating complex functionality, splitting your plugin into multiple files and folders might be easier. The choice is yours, but following a few good tips will make your life easier.

If your plugin focuses on one main class, put that class in the main plugin file, and add one or more separate files for other functionality. If your plugin enhances WordPress’ back end with custom controls, you can create the usual CSS and JavaScript folders to store the appropriate files.

Generally, aim for a balance between layout structure, usability and minimalism. Split your plugin into multiple files as necessary, but don’t go overboard. I find it useful to look at the structure of popular plugins such as WP-PageNavi and Akismet.

Naming Your PlugIn And Its Functions
When creating a plugin, exercise caution in naming the functions, classes and plugin itself. If your plugin is for generating awesome excerpts, then calling it “excerpts” and calling its main function “the_excerpt” might seem logical. But these names are far too generic and might clash with other plugins that have similar functionality with similar names.

The most common solution is to use unique prefixes. You could use “acme_excerpt,” for example, or anything else that has a low likelihood of matching someone else’s naming scheme.

Plugin Safety
If you plan to distribute your plugin, then security is of utmost importance, because now you are fiddling with other people’s websites, not just your own. All of the security measures you should take merit their own article, so keep an eye out for an upcoming piece on how to secure your plugin. For now, let’s just look at the theory in a nutshell; you can worry about implementation once you grasp that.

The safety of your plugin usually depends on the stability of its two legs. One leg makes sure that the plugin does not help spread naughty data. Guarding against this entails filtering the user’s input, escaping queries to protect against SQL injection attacks and so on. The second leg makes sure that the user has the authority and intention to perform a given action. This basically means that only users with the authority to delete data (such as administrators) should be able to do it. Guarding intention ensures that visitors aren’t misled by a hacker who has managed to place a malicious link on your website.

All of this is much easier to do than you might think, because WordPress gives you many functions to handle it. A number of other issues and best practices are involved, however, so we’ll cover those in a future article. There is plenty to learn and do until then; if you’re just starting out, don’t worry about all that for now.

Cleaning Up After Yourself
Many plugins are guilty of leaving a lot of unnecessary data lying around. Data that only your plugin uses (such as meta data for posts or comments, database tables, etc.) can wind up as dead weight if the plugin doesn’t clean up after itself.

WordPress offers three great hooks to help you take care of this:

register_activation_hook()
This hook allows you to create a function that runs when your plugin is activated. It takes the path to your main plugin file as the first argument, and the function that you want to run as the second argument. You can use this to check the version of your plugin, do some upgrades between versions, check for the correct PHP version and so on.
register_deactivation_hook()
The name says it all. This function works like its counterpart above, but it runs whenever your plugin is deactivated. I suggest using the next function when deleting data; use this one just for general housekeeping.
register_uninstall_hook()
This function runs when the website administrator deletes your plugin in WordPress’ back end. This is a great way to remove data that has been lying around, such as database tables, settings and what not. A drawback to this method is that the plugin needs to be able to run for it to work; so, if your plugin cannot uninstall in this way, you can create an uninstall.php file. Check out this function’s documentation for more information.

If your plugin tracks the popularity of content, then deleting the tracked data when the user deletes the plugin might not be wise. In this case, at least point the user to the location in the back end where they can find the plugin’s data, or give them the option to delete the data on the plugin’s settings page before deleting the plugin itself.

The net result of all our effort is that a user should be able to install your plugin, use it for 10 years and then delete it without leaving a trace on the website, in the database or in the file structure.

Documentation And Coding Standards
If you are developing for a big community, then documenting your code is considered good manners (and good business). The conventions for this are fairly well established — phpDocumentor is one example. But as long as your code is clean and has some documentation, you should be fine.

I document code for my own benefit as well, because I barely remember what I did yesterday, much less the purpose of functions that I wrote months back. By documenting code, you force good practices on yourself. And if you start working on a team or if your code becomes popular, then documentation will be an inevitable part of your life, so you might as well start now.

While not quite as important as documentation, following coding standards is a good idea if you want your code to comply with WordPress’ guidelines.

Putting It Into Practice
All work and no play makes Jack a dull boy, so let’s do something with all of this knowledge that we’ve just acquired. To demonstrate, let’s build a quick plugin that tracks the popularity of our articles by storing how many times each post has been viewed. I will be using hooks, which we’ll cover in an upcoming installment in this series. Until then, as long as you grasp the logic behind them, all is well; you will understand hooks and plugins before long!

Planning Ahead
Before writing any code, let’s think ahead and try to determine the functions that our plugin will need. Here’s what I’ve come up with:

A function that registers a view every time an individual post is shown,
A function that enables us to retrieve the raw number of views,
A function that enables us to show the number of views to the user,
A function that retrieves a list of posts based on their view count.

Preparing Our Function
The first step is to create the folder and file structure. Putting all of this into one file will be fine, so let’s go to the plugins folder and create a new folder named awesomely_popular. In this folder, create a file named awesomely_popular.php. Open your new file, and paste some meta data at the top, something like this:

<?php
/*
Plugin Name: Awesomely Popular
Plugin URI: http://awesomelypopularplugin.com
Description: A plugin that records post views and contains functions to easily list posts by popularity
Version: 1.0
Author: Mr. Awesome
Author URI: http://mayawesomefillyourbelly.com
License: GPL2
*/
?>

Recording Post Views
Without delving too deep, WordPress hooks enable you to (among other things) fire off one of your functions whenever another WordPress function runs. So, if we can find a func[…]

Comments

Comments

Comments

So at F8 last week Facebook announced Ticker, Timeline and extensions to the Open Graph API to allow for new verbs and nouns.

Here’s what really happened.

They split their single ‘News Feed’ into 3 levels of filtering. Now (Ticker), Relevant (News Feed), Historical (Timeline). (Side note, we’ve had a ‘Ticker’ style product at Echo that we called ‘Community Stream’ for a long time now – and most of our customers and partners said to us ‘why would we want to show all that data it’s just noisy’. Maybe now they will take a second look.). Question: Will G+, Twitter and the REST of the web adopt the same model? They should.
This allows FB to collect more ‘noise’ (also known as synaptic firings or Attention data) which, in turn, allows them to find more signal (also known as synaptic inferences or attention management). I’ve long said that the answer to information overload is not LESS information – it’s MORE. The more information you have the more ability you have to find patterns and surface them in relevant places (I said it so long ago I can’t even find the link). Question: Will independent websites think to collect their OWN Attention data BEFORE sending it to FB so they can leverage for their own purposes. The value of this data is incalculable.
Having these new presentation metaphors in place, they then created a mechanism to collect more data in the form of expanded Verbs and Nouns in the Open Graph API. With this new API, user’s are now expected to abandon explicit gestures of sharing and instead, accept that every action they take is auto-shared to their friends. Question: When will the first horror stories start coming out about engagement ring purchases, personal health issues and sexual orientations being inappropriately revealed due to auto-sharing?
Using all the bling of the Timeline, along with new messaging and a simple little opt in toggle of ‘Add to my timeline’ they managed to re-launch ‘Beacon’ without anyone noticing (none of the tech blogs I saw even mentioned it). Question: Why did none of the tech media cover that angle of the story?

I continue to be in awe of Facebook’s scale, seriousness, ambition and momentum. There has never been anything like it before.

They have created an Attention Management Platform that rivals Google Search and easily out classes many of my best ideas about Attention Management and Personal Relevancy back when I was thinking about the problem.

It’s breathtaking.

And since it is all done with hard links to a single proprietary hub, it is eating the web like a cancer.

Before F8 it was clear that Google+ was a 1 or 2 years behind FB. Now they are 3 or 4.

Only time will tell who, how and why more open systems will begin to reassert themselves in the ecosystem. My bet is that it wont come from a b2c copy-cat, though. It will come from a well organized, commercially incentivized b2b play.

The part that still confuses me, though, is why ANY serious media company would want their news to load in a ‘FB canvas app’ instead of their own website. It makes zero sense. None of this changes the reality that you need to own your own data and your own point source. I made a little comparison table earlier in the week that explains why.

 



 





While you already use many functions in WordPress to communicate with the database, there is an easy and safe way to do this directly, using the $wpdb class. Built on the great ezSQL class by Justin Vincent, $wpdb enables you to address queries to any table in your database, and it also helps you handle the returned data. Because this functionality is built into WordPress, there is no need to open a separate database connection (in which case, you would be duplicating code), and there is no need to perform hacks such as modifying a result set after it has been queried.

The $wpdb class modularizes and automates a lot of database-related tasks.

In this article, I will show you how to get started with the $wpdb class, how to retrieve data from your WordPress database and how to run more advanced queries that update or delete something in the database. The techniques here will remove some of the constraints that you run into with functions such as get_posts() and wp_list_categories(), allowing you to tailor queries to your particular needs. This method can also make your website more efficient by getting only the data that you need — nothing more, nothing less.

Getting Started
If you know how MySQL or similar languages work, then you will be right at home with this class, and you will need to keep only a small number of function names in mind. The basic usage of this class can be best understood through an example, so let’s query our database for the IDs and titles of the four most recent posts, ordered by comment count (in descending order).

<?php
$posts = $wpdb->get_results("SELECT ID, post_title FROM wp_posts WHERE post_status = 'publish'
AND post_type='post' ORDER BY comment_count DESC LIMIT 0,4")
?>

As you can see, this is a basic SQL query, with some PHP wrapped around it. The $wpdb class contains a method (a method is a special name for functions that are inside classes), named get_results(), which will not only fetch your results but put them in a convenient object. You might have noticed that, instead of using wp_posts for the table’s name, I have used $wpdb->posts, which is a helper to access your core WordPress tables. More on why to use these later.

The $results object now contains your data in the following format:

Array
(
[0] => stdClass Object
(
[ID] => 6
[post_title] => The Male Angler Fish Gets Completely Screwed
)

[1] => stdClass Object
(
[ID] => 25
[post_title] => 10 Truly Amazing Icon Sets From Germany
)

[2] => stdClass Object
(
[ID] => 37
[post_title] => Elderberry Is Awesome
)

[3] => stdClass Object
(
[ID] => 60
[post_title] => Gathering Resources and Inspiration With Evernote
)

)

Retrieving Results From The Database
If you want to retrieve some information from the database, you can use one of four helper functions to structure the data.

get_results()
This is the function that we looked at earlier. It is best for when you need two-dimensional data (multiple rows and columns). It converts the data into an array that contains separate objects for each row.

<?php
$posts = $wpdb->get_results("SELECT ID, post_title FROM wp_posts WHERE post_status = 'future'
AND post_type='post' ORDER BY post_date ASC LIMIT 0,4")

// Echo the title of the first scheduled post
echo $posts[0]->post_title;
?>

get_row
When you need to find only one particular row in the database (for example, the post with the most comments), you can use get_row(). It pulls the data into a one-dimensional object.

<?php
$posts = $wpdb->get_row("SELECT ID, post_title FROM wp_posts WHERE post_status = 'publish'
AND post_type='post' ORDER BY comment_count DESC LIMIT 0,1")

// Echo the title of the most commented post
echo $posts->post_title;
?>

get_col
This method is much the same as get_row(), but instead of grabbing a single row of results, it gets a single column. This is helpful if you would like to retrieve the IDs of only the top 10 most commented posts. Like get_row(), it stores your results in a one-dimensional object.

<?php
$posts = $wpdb->get_col("SELECT ID FROM wp_posts WHERE post_status = 'publish'
AND post_type='post' ORDER BY comment_count DESC LIMIT 0,10")

// Echo the ID of the 4th most commented post
echo $posts[3]->ID;
?>

get_var
In many cases, you will need only one value from the database; for example, the email address of one of your users. In this case, you can use get_var to retrieve it as a simple value. The value’s data type will be the same as its type in the database (i.e. integers will be integers, strings will be strings).

<?php
$email = $wpdb->get_var("SELECT user_email FROM wp_users WHERE user_login = 'danielpataki' ")

// Echo the user's email address
echo $email;
?>

Inserting Into The Database
To perform an insert, we can use the insert method:

$wpdb->insert( $table, $data, $format);

This method takes three arguments. The first specifies the name of the table into which you are inserting the data. The second argument is an array that contains the columns and their respective values, as key-value pairs. The third parameter specifies the data type of your values, in the order you have given them. Here’s an example:

<?php
$wpdb->insert($wpdb->usermeta, array("user_id" => 1, "meta_key" => "awesome_factor", "meta_value" => 10), array("%d", %s", "%d"));

// Equivalent to:
// INSERT INTO wp_usermeta (user_id, meta_key, meta_value) VALUES (1, "awesome_factor", 10);
?>

If you’re used to writing out your inserts, this may seem unwieldy at first, but it actually gives you a lot of flexibility because it uses arrays as inputs.

Specifying the format is optional; all values are treated as strings by default, but including this in the method is a good practice. The three values you can use are %s for strings, %d for decimal numbers and %f for floats.

Updating Your Data
By now, you won’t be surprised to hear that we also have a helper method to update our data — shockingly, called update(). Its use resembles what we saw above; but to handle the where clause of our update, it needs two extra parameters.

$wpdb->update( $table, $data, $where, $format = null, $where_format = null );

The $table, $data and $format parameters should be familiar to you; they are the same as before. Using the $where parameter, we can specify the conditions of the update. It should be an array in the form of column-value pairs. If you specify multiple parameters, then they will be joined with AND logic. The $where_format is just like $format: it specifies the format of the values in the $where parameter.

$wpdb->update( $wpdb->posts, array("post_title" => "Modified Post Title"), array("ID" => 5), array("%s"), array("%d") );

Other Queries
While the helpers above are great, sometimes performing different or more complex queries than the helpers allow is necessary. If you need to perform an update with a complex where clause containing multiple AND/OR logic, then you won’t be able to use the update() method. If you wanted to do something like delete a row or set a connection character set, then you would need to use the “general” query() method, which let’s you perform any sort of query.

$wpdb->query("DELETE FROM wp_usermeta WHERE meta_key = 'first_login' OR meta_key = 'security_key' ");

Protection And Validation
I hope I don’t have to tell you how important it is to make sure that your data is safe and that your database can’t be tampered with! Data validation is a bit beyond the scope of this article, but do take a look at what the WordPress Codex has to say about “Data Validation” at some point.

In addition to validating, you will need to escape all queries. Even if you are not familiar with SQL injection attacks, still use this method and then read up on it later, because it is critical.

The good news is that if you use any of the helper functions, then you don’t need to do anything: the query is escaped for you. If you use the query() method, however, you will need to escape manually, using the prepare() method.

$sql = $wpdb->prepare( 'query' [, value_parameter, value_parameter ... ] );

To make this a bit more digestible, let’s rewrite this basic format a bit.

$sql = $wpdb->prepare( "INSERT INTO $wpdb->postmeta (post_id, meta_key, meta_value ) VALUES ( %d, %s, %d )", 3342, 'post_views', 2290 )
$wpdb->query($sql);

As you can see, this is not that scary. Instead of adding the actual values where you usually would, you enter the type of data, and then you add the actual data as subsequent parameters.

Class Variables And Other Methods
Apart from these excellent methods, there are quite a few other functions and variables to make your life easier. I’ll show you some of the most common ones, but please do look at the WordPress Codex page linked to above for a full list of everything that $wpdb has to offer.

insert_id()
Whenever you insert something into a table, you will very likely have an auto-incrementing ID in there. To find the value of the most recent insert performed by your script, you can use $wpdb->insert_id.

$sql = $wpdb->prepare( "INSERT INTO $wpdb->postmeta (post_id, meta_key, meta_value ) VALUES ( %d, %s, %d )", 3342, 'post_views', 2290 )
$wpdb->query($sql);

$meta_id = $wpdb->insert_id;

num_rows()
If you’ve performed a query in your script, then this variable will return the number of results of your last query. This is great for post counts, comment counts and so on.

Table Names
All the core table names are stored in variables whose names are exactly the same as their core table equivalent. The name of your posts table (probably wp_posts) would be stored in the $posts variable, so you could output it by using $wpdb->posts.

We use this because we are allowe[…]

Great piece yesterday in paidcontent.org about how TIME.com is leveraging the WordPress.com VIP SaaS platform to run all their vertical sites. In the post TIME.com cites their internal Omniture numbers, stating that ” ..verticals drove 40 percent of total site visits in 2011.“

It’s great to see Techland, Swampland, Battleland, and other TIME.com verticals that run on WordPress.com VIP highlighted in this article:

“In developing the vertical strategy, we decided to pinpoint areas of reader and advertiser interest, blow them out as mini-publications in their own right,” (Jim) Frederick (the site’s managing editor) said. “The idea was to get writers who can speak to Tech enthusiasts for Techland or personal finance fans at Moneyland, and forge new readerships, while still embracing our core audience and feeling familiar to our Time loyalists, too.””

LightBox, an amazing photography blog that lives on WordPress.com VIP and then connects effortlessly to Twitter, Facebook, and Tumblr, is a great example of WordPress as a digital hub. TIME.com uses the WordPress site to draw in audiences from various services back to the core content.

Nice work TIME.com team !

Ready to become a VIP Services Client? Some of the world’s biggest brands rely on WordPress.com VIP Services.

New plugins
PHPLeague allows you to to manage your sports leagues and can be used for many different sports like football (soccer), basketball, handball, volleyball and even ice-hockey.

Updated plugins
Google XML Sitemaps will generate a special XML sitemap which will help search engines to better index your blog.

Posts 2 Posts allows you to create many-to-many connections between posts of all kinds.

WP-Table Reloaded enables you to create and manage tables in your admin area. No HTML knowledge is needed.

The inline documentation for wp_publish_post() says that it will:

Publish a post by transitioning the post status.

and that’s exactly what it does. Moreover, that’s all it does.

If you are creating a draft post via wp_insert_post() (or wp_update_post(), which calls wp_insert_post()), certain defaults will be set for you when the post status is set to publish (or future, etc.). Among these is the automatic creation of the post_name from the post_title (if none has been explicitly provided) and setting post_date_gmt.

I had some code on my site that was hitting a service to get data, creating a draft, adding some meta data and taxonomy information, then publishing it. When I was initially doing this (and using wp_publish_post() instead of wp_update_post()), I was ending up with published, unnamed posts. Not what I had in mind.

There are two ways around this:

Use wp_update_post() instead of wp_publish_post(). This works fine, but it’s a little heavier, and conceptually I think the code reads better with the wp_publish_post() call instead.
Use wp_publish_post(), but make sure to set the post_name, post_date_gmt, etc. when you create your draft post via wp_insert_post().

For what it’s worth, I was using wp_update_post(), switched to wp_publish_post() because it seemed cleaner, and have since gone back to wp_update_post(). Using less of my own code and letting WordPress core code do more work for me feels more future-proof.

Hopefully this is useful to someone else who starts digging through the code and is having trouble deciding which of the various functions to use.

A section of the core contributor handbook will be about how to set up a local test install, including a web server, Subversion, and WordPress. Because of the various operating systems and software packages out there, we’re going to need a few different tutorials.

I need some people willing to write up procedures for a number of standard setups. This includes:

WordPress on XAMPP (both Windows and Mac) MAMP, and MacPorts
TortoiseSVN and a tutorial on command-line Subversion usage, including co, up, revert, diff; patch; conflicts, etc.
Whatever you Linux guys use

I’d also love an article on getting the test suite up and running. Anything I’m missing?

So, for these procedures, people can volunteer (probably for their current setup). Once steps are written, others will need to test them. Many procedures may heavily borrow from or link to outside resources (such as the vendor sites themselves) — this is fine. And, there may already be some good things in the Codex or on other sites about getting WordPress running. Again, fine. (There are SVN articles by both @westi and @markjaquith, and those are probably great to start from.) Gather links, screenshots, further reading, whatever will help.

So, who is in?

Comments

This is the third in a series of occasional pieces on the transformation of the newspaper business. The first two pieces, both published in 2009, were The Writing Is on the Paywall and Google in the Middle.

Information doesn't want to be free. Nor does it want to be expensive. Information wants to be reasonably priced. And when it's reasonably priced, it gets purchased.

The internet has changed patterns of supply and demand in media businesses in profound ways. We're not going back to the way things used to be. But it's a mistake to assume that the contours of the landscape in the immediate aftermath of the disruption are the permanent contours of the landscape. New patterns of supply and demand - and, in turn, new ways of doing business - emerge to replace old ones, though it can take a long time for those patterns to mature and become stable. And in the meantime, there can be a whole lot of wreckage to clean up.

The arrival of Napster and its various progeny gave rise to the assumption that the recorded music business was doomed, that no one would ever pay for music again. That assumption, which at the time seemed entirely reasonable, has proved wrong. Plenty of people now purchase music through online stores like iTunes and Amazon.com, and a growing number are purchasing subscriptions to music services like Spotify. (I recently signed up for a five-bucks-a-month Spotify plan and, despite the mediocre sound quality and the annoying gaps in the tunebase, I'm pretty happy so far.) Music is being paid for even though (a) attempts to restrict music trading through digital-rights-management schemes have failed, and (b) most of the songs being purchased can, without too much trouble, be found and downloaded for free. People, it turns out, are generally happy to pay for convenience, for the assurance of quality, and for legitimacy. (The music industry's distasteful program of suing kids for downloading craploads of free tunes actually worked; it put a little bit of fear into the minds of downloaders - and their parents.)

Similar trends have been unfolding in the motion-picture business. In addition to going out to theaters, people continue to buy and rent recorded movies and other shows, in both physical and virtual forms. What we've witnessed in the recording industries in general is that the internet has actually expanded, not constricted, the ways people consume media. In particular, we've seen the establishment of five modes of consumption,* four of which produce revenue for the supplier:

1. Unit purchase. Buy an item (song, album, movie, TV show, etc.) for a fixed price in order to own it in (theoretical) perpetuity.

2. Subscription. Pay a recurring fee to access a collection of items. The fee may be variable, tied to limits on access and use.

3. Rental. Pay a nonrecurring fee to access a particular item or a collection of items for a set period of time.

4. Ad-subsidized. Watch or listen for free, but with some form of advertising included.

5. Freeloading. Unauthorized copying or trading.

The consumption of online recordings, via all these modes, has both cannibalized and supplemented the consumption of physical media. Though physical media sales, rentals, and subscriptions have fallen, often drastically, they have not been entirely supplanted. The reason is that, even when it comes to information, a virtual good is not always a perfect substitute for a physical good. Anyone who has had their viewing of a movie interrupted as Netflix recalibrates its streaming quality in response to a fluctuation in bandwidth knows that physical media still have advantages. Those advantages will almost certainly continue to erode as online offerings improve, but they may never be erased entirely.

The expansion in modes of consumption, which is now being extended still further as a result of the proliferation of networked gadgets like smartphones and tablets, each of which offers a somewhat different experience, doesn't necessarily mean an expansion in the profits of suppliers. It seems pretty clear that the music business will never enjoy the same profitability it did back in the CD days. (As someone who bought a whole lot of recordings at exorbitant prices, I can't say this breaks my heart.) But it does show that there are still plenty of people willing to pay plenty of money for informational products, even when those products have no physical form and are freely traded online.

The newspaper business - or, more generally, the written-word business - is different from the music and the movie business. Generally speaking, a news story is a lot more fungible than a song or a film. When I want to hear a particular song, no other song is going to be a satisfying substitute, but when I want to read about the outcome of a Congressional vote, I'm a whole lot less fussy about which story supplies the details. And whereas people may listen to a song a lot of times and watch a movie quite a few times, it's rare for a person to read a news story more than once. Such differences have led some observers to argue that, even if other media products find a price online, news stories never will. People will just never pay for what newspapers produce.

Recent evidence suggests, however, that that's another mistaken assumption, again born of a belief that current circumstances will persist. Newspaper paywalls, long scoffed at, are beginning to pay off, both by producing a new stream of subscription fees and by protecting traditional print subscriptions. It was once thought that paywalls would work only for business-oriented papers like the Wall Street Journal and the Financial Times, but smartly constructed paywalls, which strike the right balance in supporting both ad-subsidized consumption and subscription consumption, are now showing signs of success for mainstream papers as well. See, for instance, Felix Salmon's piece on the New York Times's "porous paywall," Ellie Behling's review of the paywalls at the Concord Monitor, Augusta Chronicle, and Tulsa World, and John Lafayette's article on the Arkansas Democrat Gazette's well-established paywall. And a growing number of papers and other publications, from the Dallas Morning News to the Intelligencer Journal-Lancaster New Era, are testing paywall variations, which will help the industry gain a better sense of what works and what doesn't. In fact, a recent study reveals that about half of all small newspapers now charge for online content in some way, and most of the rest are planning to institute paywalls.

Newspapers are also getting smarter about distinguishing between the more fungible and the less fungible elements of their products - and focusing their talents and investments on the latter. Less fungible means more distinctive, and distinctiveness in written news can manifest itself in many forms, from news analyses, to human-interest narratives, to smartly written editorial columns, to editorial skill in creating a bundle of stories, to compelling packages of local news and event coverage. Finally, and crucially important, the huge overabundance of supply in the news market, a consequence of the collapse of geographical boundaries that traditionally separated newspapers, is slowly ebbing as journalists are laid off and newspapers go under. The pruning of supply is ugly, but, from a business standpoint, it's both inevitable and necessary.

What we're coming to understand is that, in the newspaper business as in the music and motion-picture businesses, convenience, assurance of quality, and legitimacy are valued by consumers. Mainstream news consumers are not news geeks. They do not want to spend an inordinate amount of time flitting among sites, aggregation services, RSS readers, and tweet streams to cobble together a sense of what's happening in the world. Many of them will choose to pay for convenience, assurance of quality, and legitimacy, and, as with music and movies, they will likely pay in a variety of ways - unit purchases, subscriptions, even rentals - depending on their needs. Many others will refuse to pay, limiting themselves to what's available in purely ad-subsidized models. (And, of course, there will be plenty of freeloaders who take pride and pleasure in figuring out ways to defeat paywalls.) The newspapers that will survive, and perhaps even thrive, in the years to come will be those that are able to offer the most distinctive products and to tailor those products to a variety of consumption modes, spanning payment methods and devices, in a way that maximizes revenues and optimizes readership. And because an online news site is not a perfect substitute for a printed paper for either readers or advertisers - I cancelled my paper subscription a couple of years ago but ended up resubscribing after realizing that I was missing something - print editions will likely remain a crucial element in the mix indefinitely.

There is a group of new-media pundits - let's call them the Self-Appointed Guardians of Web Orthodoxy (SAGWOs) - who encourage newspapers to launch all sorts of online distribution and editorial experiments. That's good advice. But the SAGWOs have heaped scorn on experiments with paywalls and subscriptions and pricing. That's terrible advice. Newspapers and magazines need to test all sorts of ways to get people to pay for news. That's the only way to secure a vibrant future for quality journalism. Many of the experiments will fail. But some will succeed. And, eventually, we'll see the emergence of sustainable, robust new business models, probably characterized by a broader set of revenue sources than existed before. If the last decade was the decade of digital destruction for newspapers, the current decade may turn out to be the decade of rebuilding.
____

*I realize that there are some who will take offense at my use of the c-word - "consumption" - as it conflicts with their belief that the web has made media consumption obsolet[…]

WPBeginner has an excellent tutorial that describes how to use the built in functions of WordPress to generate additional image sizes for use in themes. This is possibly a better alternative than using TimThumb.

Related posts:Screencast: Basic Image Editing In WordPress 2.9

In this week’s career chat, we talked with Kim Bui, community editor and social media specialist at Southern California Public Radio’s KPCC-FM. Bui wears several hats in her role, working at the station and in the community. She… Read more

Comments

What is the newly launched BostonGlobe.com? Depending on what type of device you use to view it, you might guess it’s a regular desktop website, a tablet Web app, or a mobile phone site.

All of those answers are… Read more

The Boston Globe moves most of its content behind a paywall today, to a new website aimed at people who want to immerse themselves in the Globe’s journalism.

The longstanding Boston.com remains a free site, including teasers for all Globe… Read more

Comments

Did you ever get bounced around between departments when interacting with a company or service? This happened to me recently with my credit card: the card issuer and the bank backing it seemed to disagree who was responsible for my problem. Each blamed the other. I got caught in the middle.

My communication with them also crossed multiple channels. For some things I used their website, for others I had to call. There were emails, regular mail and even a fax involved as well. None of it seemed coordinated. Apparently it was my job to piece it together. Bad experience.

Why does this happen? All too often companies are focused on their own processes, wrapped up in a type of organizational navel gazing. They simply don’t know what customers actually go through.

What’s more, logical solutions can cross departmental lines. Ideal solutions may require crossing those boundaries. An organization’s rigid decision making makes that difficult.

Here’s where I believe IAs and UX designers can use our skills to make a difference. We have the ability to understand and to map out both business processes and the user experience. Visual representations can provide new insight into solutions that appeal to a range of stakeholders. Alignment diagrams are a key tool to do this.

Mapping The Experience
“
Alignment diagrams reveal the touchpoints between a customer and a business. Illustrating these helps a company shift its inward-focusing perspectives outward. Alignment diagrams make the value creation chain visible.
”
The phrase “alignment diagrams” describes a class of documents that reveal the touchpoints between a customer and a business. These touchpoints are organized and visually aligned in a single graphical overview. Illustrating these touchpoints helps a company shift its inherently inward-focusing perspectives outward. Alignment diagrams make the value creation chain visible from both sides of the fence.

Alignment diagrams are not new. In fact, you’ve already used them. Thus my definition of alignment diagrams does not introduce a new technique but rather recognizes how existing techniques can be seen in a new, constructive way. 

Alignment diagrams have two major parts. On the one side, they illustrate various aspects of user behavior—actions, thoughts, and feelings, among other aspects of their experience. On the other side, alignment diagrams reflect a company’s offerings and business process in some way. The areas where the two halves meet gives rise to touchpoints, or the interactions between customers and an organization.

Below are examples of two diagrams that illustrate the alignment principle.

Example 1: Service BlueprintThe first example is a service blueprint created by Brandon Schauer of Adaptive Path (Figure 1.). This shows the chronological flow of steps for attending a live event, in this case a panel on service design. (See the original details of the event from 2009 [1]).

The top two rows show the phases and physical devices a participant might use. We can call this the “front stage.” The bottom three rows show the activities of the organizer. These are “backstage” activities. These two parts are separated by the “line of interaction,” or touchpoints between participants and organizer of the event.

Figure 1: An example of a simple service blueprint by Brand Schauer, Adaptive Path

Example 2: Mental Model DiagramThe next example of an alignment diagram is a mental model. Indi Young developed this technique and detailed it in her book Mental Models (Rosenfeld Media, 2008) [2].

Figure 2 is a slightly simplified version of a mental model diagram, but it shows the alignment principle well. This example shows a mental model for activities related to “getting up in the morning.” The top half hierarchically arranges user actions, thoughts and feelings gleaned from primary research. These are clustered together into broader “goal spaces” (e.g., “Get Dressed”).

Below the center horizontal line are products and services that support people in these activities. With this alignment, providers of goods and services can see where they address user needs and where there are gaps.

Figure 2: An example of a mental model diagram by Indi Young, reflecting the alignment principle.

There are other visual styles and approaches to alignment diagrams beyond the above figures. (See the list of Alignment Diagram resources at the end of this article.) Customer journey maps and workflow diagrams are also examples. So there is no single approach to the alignment technique. Instead, you choose the form, the information included, and the way you present them to shape your overall message. It depends on your situation. The important thing to remember is that an alignment diagram shows user behavior aligned to business activity to reveal touchpoints.

Locating Value
“
An analysis of the touchpoints between users and the business lets us see value creation from both sides of the equation at the same time. This is at the core of the alignment technique.
”
Businesses ultimately need to earn money. But to do so they also have to provide some value to customers. An analysis of the touchpoints between users and the business lets us see value creation from both sides of the equation at the same time. This is at the core of the alignment technique.

In a previous Boxes and Arrows article entitled “Searching for the Center of Design,” Jess McMullin proposes what he calls “value-centered design.” [3] Instead of focusing solely on the business or solely on users, Jess advocates focusing on how value is created for both. “Value-centered design” is the approach he prefers. He writes:

The basic premise of value-centered design is that shared value is the center of design. This value comes from the intersection of: business goals and context, individual goals and context, and the offering…and delivery.
Value-centered design starts a story about an ideal interaction between an individual and an organization and the benefits each realizes from that interaction.
Jess McMullin, “Searching for the center of design”, Boxes and Arrows, 2003.
Alignment diagrams let us tell the story of value creation.

Once completed, alignment diagrams serve as diagnostic tools. With them we can spot and prioritize areas for improvement. They also point to opportunities for innovation and growth. Ultimately, alignment diagrams let designers capture and reflect how value is created in a holistic way. When communicated to decision makers, this can have real business impact by changing the focus from how products are made to the experience customers have.

Who Creates Alignment Diagrams?
“
Modern business challenges are wicked problems. Organizations unknowingly pass this complexity on to customers, resulting in negative user experiences. Alignment diagrams can reduce complexity for both customers and for organizations. They are an antidote to the challenges our business partners face.
”
The good news is you probably already have the skills needed to create alignment diagrams. These include:

1. Conducting ResearchAlignment diagrams are not made up. They are based on real data. Face-to-face interviews and observation work best. This includes contacting people on the business side: stakeholder research is part of the alignment technique.

2. Synthesizing FindingsDesigners are good at describing abstract concepts, such as an intended experience. We’re able to empathize with users and summarize their perspective well. And we can communicate this back to our business partners in a way they can understand.

3. Visualizing InformationAlignment diagrams are visual stories. Designers are good at representing ideas in graphic form. The visual nature of alignment diagrams makes them compact and immediately understandable.

4. BrainstormingAlignment diagrams serve as an excellent stimulus for a workshop or brainstorming session. Designers have the skills to creatively brainstorm and lead such sessions.

5. Prototyping SolutionsExploring different directions is a key aspect of “design thinking.” Designers are well-versed in trying out different options—from sketching to wireframing to prototyping.

Keep in mind that the lines between design-related disciplines are blurring. Service designers increasingly use online services and digital kiosks in their concepts. UX designers must be able to integrate offline support and services into their solutions. IAs need to be able to structure information across channels, including physical spaces. Interaction designers must conceive of workflows and actions across media types and devices.

In the end, alignment diagrams aren’t the domain of one field or the other: they can inform any field. The skills needed to create them, listed above, cross these lines as well.

Getting Started
“
Alignment diagrams start a conversation towards coherence, bringing actions, thoughts, and people together to foster consensus. More importantly, they focus on creating value—for both the customer and the business.
”
Understanding the mechanics of alignment diagrams is fairly straight forward. The hard part is getting your foot in the door. Often designers aren’t called in until after a project is already set up. Alignment diagrams, however, really need to impact decisions much earlier in the process—before a project even starts. This means you need to “swim upstream” and reach out to a potentially new set of stakeholders.

For designers in internal teams, you may have access to managers, product owners and other executives who could benefit from alignment diagrams at a strategic level. For external consultants, pitching a case for an alignment diagram effort may be harder: reaching high-level decision makers is difficult. Either way, you’ll need to effectively evangelize alignm[…]

  


PayPal is the most popular platform for receiving online payments today. The ease of opening a PayPal account and receiving payments compared to opening a merchant account with a traditional payment gateway is probably the number one reason for its popularity, with a close second being the comprehensive API that PayPal provides for its payment services.

Disclaimer: PayPal’s API is among the worst I’ve ever had to deal with. Inconsistencies, sometimes poor or conflicting documentation, unpredictable failures and account changes, and major differences between the live and sandbox versions all conspire to make the PayPal API quite a pain in the arse to work with. Over the years, I’ve taken my lumps from working quite a bit with the PayPal API, and I’ve published the results of my hard-learned lessons as a commercial PHP PayPal API component on the source-code marketplace Binpress.

In this post, I will break down some of the techniques and approaches to working with the PayPal API, in order to make integration and troubleshooting simpler and easier.

The Different Payment Options
PayPal offers a variety of payment options, which might be confusing at first:

Express Checkout
The premier PayPal service. Express Checkout allows you to receive payments without having a merchant account and without having to meet special requirements other than verifying your account (either via a bank account or a credit card). Previously, you could receive Express Checkout payments from PayPal users only, but PayPal has since added a credit-card option for non-PayPal users, making this service accessible to practically anyone with a major credit card. Note that the Express Checkout process occurs on PayPal’s platform and thus can never be fully integrated in your website’s experience.
Direct Payment
The Direct Payment method allows you to receive credit-card payments directly through an API call. This enables you to host the payment process on your website in full, which might make for a more complete shopping experience for your customers. The Direct Payment method has several variations that enable you to authorize a payment and complete it at a later date: the appropriately named Authorization and Capture methods. These variations are a part of the Website Payments Pro API, which is available only to US, Canadian and UK accounts.
Recurring Payments
This allows you to set up a recurring transaction (i.e. a subscription payment).
Mass Payments
This allows you to transfer money to multiple accounts at once.
Adaptive Payments
Here is another API for sending funds to multiple recipients, with some differences from the Mass Payments API. (Did I mention that the PayPal API is confusing and a bit redundant?)

This list is not comprehensive, but it covers the main payment options (see the API documentation for more).

Making API Requests
PayPal supports two main formats over HTTP: NVP and SOAP. NVP is short for Name-Value Pair, and SOAP stands for Simple Object Access Protocol. I will cover the NVP approach, which I prefer to SOAP’s relatively verbose and complex syntax.

Each of the API methods has different parameters, but they all share some basic parameters, which are used to identify the API account and sign the transaction. These include:

USER
Your PayPal API user name.
PWD
Your PayPal API password.
VERSION
The version number of the NVP API service, such as 74.0 (the most recent as of this writing).
SIGNATURE
Your PayPal API signature string. This parameter is optional if you use a certificate to authenticate.

The last required parameter is METHOD, which declares which API method we are calling.

Requests are made over HTTPS. We’ll use cURL to build our basic request, and then encapsulate the process in a class:

class Paypal {
/**
* Last error message(s)
* @var array
*/
protected $_errors = array();

/**
* API Credentials
* Use the correct credentials for the environment in use (Live / Sandbox)
* @var array
*/
protected $_credentials = array(
'USER' => 'seller_1297608781_biz_api1.lionite.com',
'PWD' => '1297608792',
'SIGNATURE' => 'A3g66.FS3NAf4mkHn3BDQdpo6JD.ACcPc4wMrInvUEqO3Uapovity47p',
);

/**
* API endpoint
* Live - https://api-3t.paypal.com/nvp
* Sandbox - https://api-3t.sandbox.paypal.com/nvp
* @var string
*/
protected $_endPoint = 'https://api-3t.sandbox.paypal.com/nvp';

/**
* API Version
* @var string
*/
protected $_version = '74.0';

/**
* Make API request
*
* @param string $method string API method to request
* @param array $params Additional request parameters
* @return array / boolean Response array / boolean false on failure
*/
public function request($method,$params = array()) {
$this -> _errors = array();
if( empty($method) ) { //Check if API method is not empty
$this -> _errors = array('API method is missing');
return false;
}

//Our request parameters
$requestParams = array(
'METHOD' => $method,
'VERSION' => $this -> _version
) + $this -> _credentials;

//Building our NVP string
$request = http_build_query($requestParams + $params);

//cURL settings
$curlOptions = array (
CURLOPT_URL => $this -> _endPoint,
CURLOPT_VERBOSE => 1,
CURLOPT_SSL_VERIFYPEER => true,
CURLOPT_SSL_VERIFYHOST => 2,
CURLOPT_CAINFO => dirname(__FILE__) . '/cacert.pem', //CA cert file
CURLOPT_RETURNTRANSFER => 1,
CURLOPT_POST => 1,
CURLOPT_POSTFIELDS => $request
);

$ch = curl_init();
curl_setopt_array($ch,$curlOptions);

//Sending our request - $response will hold the API response
$response = curl_exec($ch);

//Checking for cURL errors
if (curl_errno($ch)) {
$this -> _errors = curl_error($ch);
curl_close($ch);
return false;
//Handle errors
} else {
curl_close($ch);
$responseArray = array();
parse_str($response,$responseArray); // Break the NVP string to an array
return $responseArray;
}
}
}

Note that I use a CA certificate file for SSL certificate validation. You can obtain the file from the cURL website or any trusted source. Update the path to the certificate file according to where you’ve placed it.

The response returned will be in NVP format as well, and I reformat it into an array before returning it. A parameter named ACK signifies the status of the request: Success or SuccessWithWarning when the request succeeds, and Error or Warning when the request fails.

A request could fail for many reasons, and there are different reasons for each API method, which are covered in detail in the manual. We’ll go over some further down in this article and look at ways to handle them. Keep in mind that the parameter values are case-sensitive, so code against them accordingly.

Express Checkout
One of the most popular APIs is the Express Checkout API, which enables you to receive payments without opening a Website Payments Pro account (which is available only to verified US accounts) or hosting the actual transaction yourself (which requires additional security).

The Express Checkout process works as follows:

We request a checkout token from PayPal using the transaction details;
If successful, we redirect the user to the PayPal endpoint using the received token;
The user completes or cancels the payment on the PayPal platform and is redirected back to our website;
We complete the payment either when the user is redirected back or via an Instant Payment Notification (IPN).

1. Getting the Checkout Token: SetExpressCheckout
We initiate the Express Checkout process by passing the order details to the PayPal API, and we receive a token string that identifies it. This token would be used in the next step to redirect to PayPal.

Here are the required parameters:

METHOD
This is the API method that we’re using (i.e. SetExpressCheckout).
RETURNURL
The URL that the user will be redirected to after the payment process is completed.
CANCELURL
The URL that the user will be redirected to after having cancelled the payment process.
PAYMENTREQUEST_0_AMT
The transaction’s total amount. This must have two decimal places, with the decimal separator being a period (.). The optional thousands separator must be a comma (,).
PAYMENTREQUEST_0_ITEMAMT
The total cost of the items in the order, excluding shipping, taxes and other costs. If there are no extra costs, then it should be the same value as PAYMENTREQUEST_0_AMT.

We can pass additional parameters to add more information about the order, some of which have default values:

PAYMENTREQUEST_0_CURRENCYCODE
The payment’s currency, as a three-letter code. The default is USD.
PAYMENTREQUEST_0_SHIPPINGAMT
The total shipping costs for this order.
PAYMENTREQUEST_0_TAXAMT
The total tax amount for this order. This is required if per-item tax is specified (see below).
PAYMENTREQUEST_0_DESC
The order’s description.

We can also add details about individual items in the order:

L_PAYMENTREQUEST_0_NAMEm
The item’s name.
L_PAYMENTREQUEST_0_DESCm
The item’s description.
L_PAYMENTREQUEST_0_AMTm
The item’s cost.
L_PAYMENTREQUEST_0_QTYm
The quantity of an item.

The variable index m identifies the item. (Use the same variable for all details of the same item.)

There are many other optional parameters, which can be found in the API documentation.

We’ll use the function that we wrote above to build the SetExpressCheckout request:

//Our request parameters
$requestParams = array(
'RETURNURL' => 'http://www.yourdomain.com/payment/success',
'CANCELURL' => 'http://www.yourdomain.com/payment/cancelled'
);

$orderParams = array(
'PAYMENTREQUEST_0_AMT' => '500',
'PAYMENTREQUEST_0_SHIPPINGAMT' => '4',
'PAYMENTREQUEST_0_CURRENCYCODE' => 'G[…]

Comments

Baseball is undergoing a digital revolution thanks to the iPad and the iPhone. Sports fans, management and even players are using the iPad to improve America's favorite game. Fans can watch every Major League game on their phone or tablets. Managers can keep track of their rosters and players can analyze both their own performance and that of their competitors.

Companies like Baseball Info solutions have embraced this trend. The service compiles the statistics for every player in the Major Leagues and makes it available to all thirty MLB teams. Sports professionals are not alone in this move to a digital future. Recently, we took a look at Extra Innings Mobile Instructor, an app which lets coaches and parents record and analyze the technique of both hitters and pitchers.

And baseball isn't the only sport being transformed by the iPad. Recently, the Tampa Bay Buccaneers handed out iPads to all its players and management to replace the paper-based playbook.
How the iPad is changing baseball originally appeared on TUAW - The Unofficial Apple Weblog on Wed, 31 Aug 2011 14:30:00 EST. Please see our terms for use of feeds.
Source | Permalink | Email this | Comments

What do you think is the most important novel of the past 10-and-a-bit years (published since January 1st 2000)?

Explain your reasoning. (Novels by "Charles Stross" are disqualified.)

By Will Evans


Exploring opportunities and innovate products to better serve customers needs.




I first learned the Design Studio methodology from Todd Zaki Warfel, founder of Message First and perhaps one of the best designers I’ve been fortunate enough to learn from. The concept originated in architecture and industrial design schools, and I believe Todd was the first to apply it to collaborative design of complex software systems.

read more

Comments

Sleeve cameras aren't new, but they're now smaller than ever and the cheaters are getting more sophisticated:

In January, at the newly opened $4-billion Cosmopolitan casino in Las Vegas, a gang called the Cutters cheated at baccarat. Before play began, the dealer offered one member of the group a stack of eight decks of cards for a pre-game cut. The player probably rubbed the stack for good luck, at the same instant riffling some of the corners of the cards underneath with his index finger. A small camera, hidden under his forearm, recorded the order.

After a few hands, the cutter left the floor and entered a bathroom stall, where he most likely passed the camera to a confederate in an adjoining stall. The runner carried the camera to a gaming analyst in a nearby hotel room, where the analyst transferred the video to a computer, watching it in slow motion to determine the order of the cards. Not quite half an hour had passed since the cut. Baccarat play averages less than six cards a minute, so there were still at least 160 cards left to play through. Back at the table, other members of the gang were delaying the action, glancing at their cellphones and waiting for the analyst to send them the card order.

I didn't go to Gamescom this weekend. I easily could have, it's less than 2 hours away by train, and neither train tickets nor entry tickets were prohibitively priced. But based on my experience with conventions and videos I saw from previous Gamescoms, I decided that it would probably be too crowded to be enjoyable for me. That turned out to be an accurate prediction, with people reporting dangerously crowded conditions at the entrance, and queues of up to 4 hours wait for the privilege of trying out a new game for 10 minutes on Sunday. I probably got more info staying at home and watching videos on various websites about the games presented in Cologne than what I would have seen if I had been there.

Now one of the videos I saw was Total Biscuit's 25 minutes of SWTOR commented gameplay. And one thing that struck me was that obviously there were problems in the starter zone shown with mobs not spawning fast enough for the handful of people trying to kill them for their quests. I got flashbacks to the best screenshot of World of Warcraft that I failed to take: 10 players in Elwynn Forest on launch days camping a level 1 kobold spawn spot.

Now the video also showed the main story line quest locations being instanced, and I'm not sure if you could simply skip all the side quests and play without being bothered too much by the inevitable crowding on the first days. But the whole thing makes me wonder whether there isn't a better way to start a new MMORPG.

The problem in this sort of game for the moment is that your location is linked to your level. There simply aren't all that many places where a level 1 character can go in these quest-based, level-based games. By choosing your faction and class, you automatically already chose the list of chores and errands disguised as "quests" that your character is going to do early on in his career. And on launch day, everybody is level 1, and thus has the same laundry list of stuff to do as those of the same class. "Kill 10 womp rats" type of quests are already by themselves not very interesting. But if the 10 womp rat spawn points are camped by 50 players, those quests are getting downright annoying. And even if the main story is instanced, you can't help but constantly run across other players which are obviously on the same story, which makes it hard to feel special.

Now ideally in an open world setting there would be a huge wilderness populated by low-level monsters, in which starting players would be randomly distributed. So players would be alone, would get quests not from NPCs but by some sort of long-distance communication, and would spend their early days learning how to fight mobs in the wilderness and getting towards a city somewhere in the center of it. But even that approach is probably not going to work if you consider SWTOR already having sold 350,000 pre-orders in the US alone.

So I question the value of having the start be open world in Star Wars: The Old Republic. Wouldn't it be better if the first 10 levels would be completely instanced before releasing players into an open world? It isn't as if they were likely to want to group for the low levels anyway. Somebody starting a new character half a year after launch is likely to play through an empty starter zone anyway, so why not offer that experience to everybody right from the start?Tobold's MMORPG Blog

A few months ago the wonderful Giles Colborne and I were given an interesting challenge by Sjors Timmer and Matthew Solle who were organising the UXDO event for August. Would we run a session on Workshop Facilitation.

Of course we would, but the question was… could we run a workshop about workshop facilitation?

Well, it was certainly worth a shot.

And so it was that twenty something very meta workshop participants bravely joined us last week for a workshop on workshop facilitation. It went a little something like this….

Workshop Plan: 
We posted our workshop plan, including timings, onto the wall.

The workshop was structured broadly following the KJ Technique with some collaborative affinity sorting and then ending with some group discussions on key topics. We structured the workshop in a way that promoted  a pattern of widely exploring the breadth of the problem area, then synthesis or exploration of the  patterns that emerge from our exploration and then consolidating into actions and findings.

7pm: Welcome
7.05pm: Private brainstorm (Exploring the problem space)

Question: What are the biggest challenges you face when putting on workshops?

Write challenges on to post it notes – one idea per post it notes, in capital letters using an appropriately heavy marker.

7.10pm:  Post up 

To save time we didn’t do the ideal thing of discussing each idea as they were called out (to
capture all the nuances). Instead we asked people to volunteer whether they had similar ideas and posted them in clusters. You wouldn’t want to do this in a ‘real’ workshop as you want to give people plenty of time for discussion.

7.40pm: Grouping and sorting

We did a collaborative affinity sort by gathered in small teams, giving each team some of the clusters of post-its and re-grouped the post-its into their final clusters. We labelled the clusters with problem statements. This allowed the group to understand what the real problems were and how issues that might on the surface appear different sometimes stem from the same problem.

7.55pm: Dot voting

We gave participants Three votes each to vote for the problems they felt were most significant in blocking their ability to run effective workshop sessions – these would be the topics participants wanted to discuss in more detail later in the evening.

8pm: 1-1 Ranking

Here we deviate a little from the KJ Method. We compared cards in pairs. Rank them all, according to the question ‘What is the bigger roadblock to you running an effective, productive workshop.

8.15pm: Group discussion

We broke into small groups and brainstorm the problems and solutions
Again, this took two parts: firstly, examine the problem – what is it? what causes it? – make notes about this at the top of the flip chart. Then solutions – what’s worked well? why? List ideas on the bottom half of the flip chart.

8.35pm: Groups present back
We heard from all the groups on their problems and solutions

8.58pm  Wrap up and head to the pub! (Although, in all honestly, we did end up running a little late… too much interesting discussion!)

Workshop planning tips:

TIP: Workshops are about the attendees, not your designs. Turn your attention outward. Make
the participants feel valued and listened to.

TIP: Every workshop needs to go through a phase of expansion (where you gather ideas) and exploration (where you understand ideas) and consolidation (where you set the outcomes). Your workshop structure should follow this flow.

TIP: The attendees have given up their valuable time to be there – recognise and respect this. Be clear about what you need from them, plan well, get as much as you can out of the day and communicate it back.

TIP: We posted the agenda and timings up on a big sheet at the front of the room. The agenda is not a secret and making it visible helps everyone to know where they are and where they’re going. It also means you can discuss it and make visible changes (if you need to) during the workshop.

TIP: When you’re planning your workshop remember its important to leave plenty of time at the end for your wrap up. People need to be heard. We’ve been to workshops where the moderator has ended by saying ‘we don’t have time for a wash-up, but please think about what we’ve said today.’ What a let down. Make sure there’s enough time to go around the room one last time.

TIP Make sure they’re putting just one idea per Post-It. Post-Its are the atoms of your workshop – and you don’t want to split the atom in the middle of a workshop.

The outputs: Affinity sort

These are the problem statements (and the related post-its) that we gathered.

Before the workshop

How do we know who to invite?
Inviting the right people | Getting the right people in the room | Decide who attends | Who is coming? (+ What do they do?) | Right people | Knowing about the likely audience

How do we agree on a date?
Agree on a date | Right time in the process

How do we communicate the problem to solve?
Describing the problem | Agreeing outcomes | Selling the whole idea | Agreeing the content, purpose, objective | The outcomes you need from it | Reason why | Agreed purpose

How do we create a good physical environment?
Venue & equipment | Cleaning the whiteboards | Venue | Choosing funky music | Maximising resources & space | When should I start to prepare | Right location | Finding a good space | Post it notes not sticking | Establishing the ‘right environment’ | Which alcohol to bring | What should I bring?

How do we make sure they’re in the room?
Making invitations that people will stick to | Make them show up | Getting people enthusiastic | Convincing stakeholders to participate

What to do?
How to structure the workshop | Lack of good methods | Appropriate method for participants | Which activities lead to the right results

During the workshop

How to manage time?
Knowing when to stop | Managing time

How do we get the group to work well together?
Group dynamics | Group social dynamics

How do we introduce the session?
Setting expectations | Warming up participants | Ensuring participants are prepared

How do we create the right social environment?
Break silos | Make people think creatively | Getting the client to pick up the pen | Breaking down the fear of collaboration

How to keep participants focused?
Keeping people on track | Retaining control of the group | Keeping participants on track (work issues) | Keeping people focused | Attendees not focused on listening (wondering mind) | Agenda saboutaged | Keep open without losing control

How do we best get people to participate?
Framing the right questions inspirationally | Communicating to the attendees appropriately | Knowing my own limits and strengths | Facilitating and guiding without stifling | participants not understanding workshop method or format | Letting go during the workshop – appropriately, of course

How do we maintain interest from all attendees throughout?
Keeping up energy | Going deep | Attention | Focus | Engagement | Keeping up momentum | Maintaining good, healthy energy | Going the long haul – energy

How do we deal with Hippos*, Wallflowers & Snipers
Overcoming ‘silent stares’ | Hippos! \ Handling strength of opinion | Negative attitudes | Encouraging people who are sceptical | Commitment | Wrong PX in the room – it’s not working! | Participant’s fear of coming up with bad ideas | Getting quiet folks to speak | Ensuring that everyone involved has a say | Shouty people | Avoiding one dominant voice | What to do with bigtime extroverts | People who hate workshop format as participants | Negative attitudes.
*Hippo – Highest Paid Person’s Opinion – i.e. important people who use their power from outside the workshop to override debate within the workshop.

After the workshop

How to communicate the outcomes of the workshop?
How to collate report on results | The what | Playing back findings | Summarising the workshop’s findings | Remembering details | Not missing something | Summarising efficiently | Who is writing up? | Processing — distilling

How to communicate the worth of the workshop?
Communicating the value of the workshop

How to act on stuff after the workshop?
Getting people to own actions.

How do we deal with a lack of consensus?
Managing differing opinions | Designing together without feeling the result is a big mess of compromise | Culture problems | Getting people to collaborate | Managing dissent | Divergent personalities | The personalities of people involved | Facilitating towards a good outcome

Tips for collaborative affinity sorting

TIP: Have someone to manage the labelling while the moderator leads the discussion.

TIP: We asked teams to begin each problem statement with the words ‘How do we…?’ so that we were sure these were real problems – questions that could be answered – rather than vague ‘stuff’.

TIP: There is no scientific way to approach this – point people to a bunch of post it notes and a space on the wall/table and have them get started – it will come together (and start to make more sense to everyone) as you go.

TIP: Encourage people to call out their groupings as they go. ‘I’m starting a group about scheduling over here’, ‘Does anyone have a section on difficult people yet?’ for example. The best way to encourage this is to lead by example.

TIP: Allow and spend plenty of time on this activity – it can be quite time consuming but is a format for having some really important discussions and building a shared understanding of the problem space. Have these discussions and push the group to make sure that the problem statement labels really accurately reflect the content that they represent. Don’t allow generalisations and ensure clarity.

The outputs: What the groups came up with in their short discussions on the key problems we explored.

Problem / solution – How do we communicate the prob[…]

I often travel with more than a few Apple devices, all of which usually need power at some point during the day, so the idea of this one intrigues me a lot, obviously. Energizer (the bunny people) is releasing a brand new travel charger that, as you can see above, goes industrial on charging your devices. not only does it expand an outlet into three, but there's a built-in iPhone dock, and even a USB charger to plug into on the side. That's some serious charge.

I'm sure if you plugged charging units into everything on the iSurge, you might run the risk of pulling off too much power -- especially if the outlet isn't set up right, it's hard to see how this wouldn't cause problems. Still, that's a handy little unit, even if you do end up using all of the various outlets at different times. The charger is indeed called the iSurge, and is set to be sold for $60 by the end of the year.

[via Wired]
Energizer travel charger powers your Mac, iPhone, and iPad ... all at once originally appeared on TUAW - The Unofficial Apple Weblog on Sat, 20 Aug 2011 12:00:00 EST. Please see our terms for use of feeds.
Source | Permalink | Email this | Comments

Honest freelancers keep their word to get work done on time. They value their reputation and their strong work ethic pays dividends. An enthusiastic customer recommendation about a freelancer’s performance can bring a number of new offers and better income.

It’s important to have several positive reviews in your profile. However, an experienced employer goes beyond these words and digs into more information about you. To keep tabs on your reputation online here are some simple, free tools that get the job done:

1. Google Search
Google

Don’t be surprised. Google you name. You may find work reviews you had no clue about. Check Google blogs and discussions tabs to see all posts. Besides, set Google Alerts to your name and get email notifications as soon as a new article with your name springs up. Thus, you keep track of your web reputation.

2. Twitter Search
Twitter Search

140 characters are enough to express opinion on a freelancer or give project feedback. Take a look at Twitter search to learn if someone is talking about you. Search for your name, nickname or recent projects. Join the conversation in case it’s necessary.

3. Quora
Quora

Numerous Q&A sites like Quora have tons of questions answered. Maybe one of them can be about your freelance business. Surf these places and keep an eye on important questions. Provide correct information firsthand.

4. Social Mention
Social Mention

Social Mention is a free online service that helps monitor on a topic or person-related comments. The web app works like an information aggregator bringing search, blogs, updates, and forum mentions all together. Social Mention shows top keywords associated with a topic, top authors who posted on the topic and indicates information sources. The app enables you to download reposts or subscribe via RSS. Social Mention is a bit slow; however, it’s free and gives plenty of information.

5. Addict-o-matic
Addict-o-matic

Addict-o-matic resembles Social Mention, but it works faster. It helps analyze potential feedback sources at one place. You can pick up an information channel you want to track among search engines, bookmarks, news websites, blogs, etc. Unfortunately, there’s no report download option.

6. Twitrratr
Twitrratr

Twitrratr is a simple tool to differentiate positive, neutral and negative tweets on a freelancer or a topic. Try Twitrratr instead of usual Twitter search and see people’s opinions immediately divided into 3 categories. Thus, you know your audience’s feelings about your work.

7. Tweetreach
Tweetreach

It used to be hard to measure a tweet’s influence. You had to guess if one recommended tweet will impact your freelance profit. Now it’s easy to measure how many people your message reached with tweetreach. Enter a word and see the volume of tweet impressions.

There's two ways to do this. I could tell you that Baby Monkey is a terrific running game, with a really fun double-jump mechanic, bright and colorful graphics, and the catchiest theme song I've heard all year (the game itself is based on Parry Gripp's song). I could say that it's got full Game Center integration, and is available in the App Store for just 99 cents right now. And I could tell you that it's a must-buy title with lots of fun and replay value.

Or, I could just tell you that it's got a baby monkey that rides backwards on a pig. Either way, you should be on your way to the App Store to pick it up right now.
Daily iPhone App: Baby Monkey (going backwards on a pig) originally appeared on TUAW - The Unofficial Apple Weblog on Thu, 11 Aug 2011 08:00:00 EST. Please see our terms for use of feeds.
Source | Permalink | Email this | Comments

If you get a chance to watch the documentary The Raid, I can recommend watching it. It is not always pleasant, but realistic enough, and touches a lot of the issues and misconceptions about raiding. Also gives you the opportunity to watch a complete Icecrown raid, in case you never did one yourself.

What struck me most about film was how much it made raiding look like work. You have to be there at a specific time for a specific amount of hours, and you have to perform well during that time. Sounds a lot like my job.

What the film failed to show was how the guild involved got their raid team together, and who got excluded. No interviews with guild members who didn't get a raid spot or got kicked from the guild, although those undoubtedly exist. Succeeding involves synchronous excellence of execution, and that ends up being both the biggest strength and the biggest weakness of the system: Winning together leads to a strong team spirit to develop (shown in the film), but losing together risks people pointing fingers at whoever they perceive to have been the weak spot.

Real-world groups of friends often include people who aren't quite as bright or successful than the others. Raiding makes that difficult for groups of friends in virtual worlds. Selecting your friends by their gearscore and raid performance gives you greater virtual rewards than selecting them based on how nice they or, or sticking with them through thick and thin out of loyalty. I still hope that we will get some mainstream MMORPG one day which is about people working together without penalizing players for sticking with their under-performing friends. I think that would lead to greater social cohesion than the raid system.Tobold's MMORPG Blog

Comments

Screeny
"The Simplest Screen Recording App For Your Mac. Ever." Looks it. I'm fed up of wrangling things like iShowU, so I might investigate this.
(tags: screencast osx mac app )

I’m a huge fan of the Puerto Rico board game: it’s one of the best-known (and one of the best) European-style board games, a category finally becoming popular in the United States with the success of Settlers of Catan.

Unlike most games popular in the U.S., this genre is known for relying much more on strategy and less on luck. Settlers of Catan is actually more of a hybrid in this way: I’d say it relies on luck about as much as Monopoly does, in that even a great strategy can be sunk from a streak of bad luck with the dice.

Puerto Rico is almost pure strategy, with only two relatively inconsequential random elements — the plantation tiles available in each Settler phase, and the initial play order (who goes first) — and the game effectively minimizes and balances the impact of these. It’s no surprise, then, that it dominated BoardGameGeek’s top-ranked list for most of the last decade.

It requires at least three people to play, so a geeky board-game couple like us can only play it as often as we can convince someone to come over and learn it. Everyone we’ve taught to play1 loves the game, including non-geek friends, parents, and siblings, but there are a lot of pieces and a lot of rules. It’s of similar complexity as Settlers of Catan and is therefore best taught virally: you play with someone who knows it and explains it as you go. That’s how I learned (thanks, Andrew!), and I can’t imagine three people sitting down and trying to figure it out from scratch.

As soon as I learned that there was an upcoming Puerto Rico iPad game, I was thrilled: I could finally play this awesome game more often than the twice a year or so that I could convince enough people to play. Plus, the iPad is an excellent board-game platform, so why not port an excellent board game?

I’ve been testing an advance copy of Puerto Rico HD this week, and it’s now available in the App Store. In short: Fans of the board game are going to love this.

Click for big. Or see later in the game.

The board game’s assortment of cards and tiny pieces makes for a huge interface challenge. While there are some small things I would have done differently, Codito Development did a pretty good job with this. It’s clear that they really care about doing the game justice: it’s nothing like the half-assed licensed ports that we usually see from well-known board-game brands.

I was worried that such a complex game wouldn’t have a very good AI, but this AI is excellent. I win regularly against the Medium opponents, but the Hard AI players beat me often. It’s the perfect balance of AI skill without making the game too easy or frustratingly difficult. Single-player is therefore very satisfying, and I can play a speedy game in about 15 spare minutes.

I didn’t have a chance to try the online multiplayer via Game Center, but while it doesn’t support asynchronous turn-based play with multiple simultaneous running games (like Words With Friends), the developer has hinted that it might get this feature in the future.

Tiff and I did play some hot-seat games (both of us taking turns in front of one iPad), and it works extremely well, with the ability to mix any number of human and AI players.

A nice little trick makes hot-seat play exceptional: in the player setup screen, you can tell it which side of the iPad each player is sitting on, and it automatically rotates the interface to face each player on their turn. (Only the two landscape orientations are supported.) That way, if you’re sitting at a table, you can lay the iPad flat in the middle and play comfortably without rotating it constantly. And you can comfortably watch your wife decimate you by buying a wharf and a harbor and shipping out incredible quantities of corn.

Playing the physical board game is an hour of tangible fun with friends or family; playing the iPad game is 15 minutes of amusement with any number of friends (including zero), no setup, and no cleanup. Neither replaces the other. One of the best uses for the iPad game is improving your skills and discovering new strategies to make your real-world gameplay more interesting.

I love that this game is finally available for iPad and we now have that choice.

My only hesitation is that I don’t think I could recommend the iPad edition to people unfamiliar with the board game. Maybe it’s just me2, but I don’t think this would be an easy game to figure out on your own in an app, through no fault of Codito or Ravensburger. The game does have a built-in tutorial, strategy suggestions, and complete instructions, though, so I’m curious: if you’re able to figure out how to play from the app with no previous experience with the board game, please let me know.

If you’re familiar with the board game, or you’re confident that you could learn it from the app, get it from the App Store now. It’s a great, solid iPad adaptation of the best board game I’ve ever played.

It’s always a bit uncomfortable teaching new players about taking these brown “colonists” off the boat and putting them to work on our tobacco plantations without paying them so we can ship crops to the mainland.

(Settlers of Catan isn’t much better. What’s the only black piece in the game?) ↩

I still can’t figure out Carcassonne from its widely-praised iOS app alone. I just don’t have the patience to learn a complex board game from its computerized version. ↩

Levi Asher's story of riding the dot-com boom and bust at Pathfinder and iVillage  

Iomega has just introduced the new Mac Companion Hard Drive, a 2 or 3 TB external drive that not only offers a lot of storage in a nice-looking container, but also provides a high-powered USB port to charge up your iPad.

The Mac Companion is priced a bit higher than high-capacity USB external drives, with the 2 TB model weighing in at US$195.00 and the 3 TB model at $295.00. However, the manufacturer's suggested retail price is right in line with many other FireWire 800 drives, and the Mac Companion can connect through FireWire 800 as well as USB 2.0.

The Mac Companion also fills the job of a hub. It not only has a 2.1 Amp USB charging port for your iPad, but two more USB ports in a built-in hub and two FireWire 800 ports. Iomega provides cables to get your Mac and the Mac Companion working together off the bat -- one FireWire 800 cable, one conversion FireWire 400-800 cable, and one USB 2.0 cable.

When placed near just about any modern Mac, the Mac Companion fits right in. The aluminum case has four LEDs on the front to let you know how much free space you have left on the drive. Iomega provides software to enable scheduled file-level backups, although most Mac users will want to use the Mac Companion with Time Machine. Iomega also provides a free 2 GB online backup through MozyHome for extra assurance.

TUAW is hoping to get one of the Mac Companion Hard Drives for a full review, so stay tuned for more details.

Iomega Mac Companion Hard Drive: Big storage, high-powered charging ports originally appeared on TUAW - The Unofficial Apple Weblog on Tue, 02 Aug 2011 09:00:00 EST. Please see our terms for use of feeds.
Source | Permalink | Email this | Comments

Comments

We all sometimes end up in situations that we’d rather not be in. From annoying coworkers to bad blind dates, sometimes a way out can be rather convenient. As technology advances, new ways of getting out of such situations are often showing up. One of these is the Fake Call API, designed to send phone calls to your phone via a web API call.

It works like this: you make an API call to set up verification that you do, in fact, own the given phone. You do this as follows, as described by the site:

creating/verifying an account

This will call the number you specify and ask you to verify you have the phone in your possession by entering a 2 digit code. The password is whatever you want it to be, and which you’ll use in the future for Basic Authentication when you need to do any other API calls.

This is also how you change your password if you’ve forgotten it.

PUT http://api.fakecall.net/v1/account/(your number)
password=your%20password%20here

Creates an account for 123-456-7890 with password “your password here”, which number and password will be used for HTTP Basic Auth for all other API calls in the future:

curl –request PUT –data “password=your password here” \

http://api.fakecall.net/v1/account/1234567890

After doing that, you can make API calls to authorize other accounts with their own verified phone numbers to make calls to your number through the service as well, so you can allow friends to use the API to rescue you. You can get a list of those authorized to call you, delete your account, or make a call to yourself, using the password you set up.

At the moment, the service does not have its own SSL certificate, though you can use HTTPS with a warning. Due to the service’s nature, you are handing your phone number to the owner of the API, so it isn’t the most secure of services. It is free, however, and rather neat. In addition to being an API, it’s also a mashup, built on the Twilio Voice API.

One could easily use the Fake Call API to execute code at a specific time, such as cron, to give yourself an out during a blind date, family function, party, or anything you might like an out for. Making a mobile client for this could also work well, either to use for yourself or for a friend using the authorization trick. All in all, it’s a simple solution to an age-old problem, and you can’t beat the price, or the ease of implementation.

Sponsored by

Related ProgrammableWeb Resources Fake Call API Profile

Comments

Comments

Sweatshop is a new browser game, developed by Littleloud for Channel 4 Education, in which players fill the role of a factory floor manager in a developing nation. Taking design cues from the tower defense genre, the game tasks you with placing skilled workers and child laborers along a conveyor belt. It's also one of the most compelling and effective political games I've seen in recent years.

Orders for different kinds of garments -- including hats, shirts, bags and shoes -- come down the line, and laborers assemble these products at varying speeds according to their specialty (or lack thereof, in the case of the children). For each completed garment, the player receives a small amount of cash that is then reinvested into hiring more workers or purchasing support items such as water coolers, fans and portable toilets. Some support items increase the speed or profitability of workers within their zone of effect, while others are required to prevent their inevitable exhaustion and (later in the game) bodily harm.

Over the course of 30 stages, players are scored on the efficiency and, ultimately, character of their management decisions. This is reinforced by a trophy system, a karma meter, and a version of the classic shoulder angel/devil duo: a pitiable Child working in the factory and the comically inhumane Boss.

The Child, who is always placed on the line for free at the beginning of each stage, explains how new support items can be used to help keep workers safe. In between stages, the Child presents brief factoids on sweatshop labor around the world. The Boss harangues players at the beginning and end of each work day, only taking a break from shouting and spewing his bad-taste humor to take phone calls from the pompous fashion industry moguls who send in orders.

A full-featured political game

Littleloud and Channel 4 previously worked together on Bow Street Runner and last year's The Curfew. The latter was essentially an interactive drama that depicts the dangers of a potential future police state in the U.K., written by comics author (and game journalism alumnus) Kieron Gillen. Because The Curfew only featured mini-games tangentially related to its full-motion video acting, I didn't know what (or how much) to expect from Sweatshop. What I found was one of the most subtle and full-featured political games that I've come across in the past few years.

For American readers who aren't exactly sure how Channel 4 works, it is a state-owned broadcaster established in the United Kingdom (UPDATE: corrected misunderstanding that it was the "fourth" UK state-owned broadcaster). Channel 4 commissions all of its programming from external companies, meaning its content has often been eclectic and cutting-edge, and over the years it has established the "4" brand as a significant name in culture and entertainment. Channel 4 Education, the department that published Sweatshop, is primarily tasked with providing entertaining pedagogical content to U.K. teenagers. Each year, C4E picks themes especially relevant to contemporary teens and invites indie games developers from around the United Kingdom to a pitch session.

"Sweatshop was Littleloud's pitch for a game about the fashion industry, one of the key topics suggested by the broadcaster for its 2011 slate," said Simon Parkin, the game's designer, writer, and producer. "As young people generally have limited disposable income, they are likely to buy cheap, fashionable clothes from high street retailers who drive down their prices by employing sweatshop labor."

During the first five to ten levels of the game, play isn't particularly difficult enough to raise any obvious alarms about the unfair labor practices that become necessary evils in sweatshop economics. As Parkin explained, "There's no leap of abstraction to view workers as 'towers' working on targets when they enter their 'area of effect.'" (In fact, the pairing of theme and play here is so strong that you might not even notice that it's a tower defense game at first.)

But that isn't the extent of the game's argument. For this early phase of Sweatshop, the factoid text bubbles at the score screen deliver most of the crucial information about sweatshop practices. If the game stopped here, it would be comparable to PETA's Mama Kills Animals; the latter doesn't actually encapsulate its social message about the inhumanity of factory farming in play itself, relying on external links and short documentary clips.

Increasingly complex

But Sweatshop is a game that, in accordance with the genre conventions of tower defense, becomes gradually more and more complex to control over time. As its play deepens, so too does its procedural rhetoric.

The first thing players will notice is that, in order to attain gold medals on each stage, they must almost constantly run the conveyor belt at double speed. At this pace, it becomes increasingly difficult to keep on top of worker fatigue and a proper mix of skilled labor for each type of garment.

My first "a-ha" moment came when I realized that I could nab a gold medal on many levels -- and minimize the amount of clicking and thinking I needed to do -- simply by covering the belt in child labor, rather than planning for and maintaining a large force of skilled workers. These workers are cheap and replaceable, meaning they also contribute to build speed and a high "money saved" score at the end of a level.

Of course, you'll still end up scoring closer to 100 percent if you replay a level many times to figure out the ideal build order for skilled workers. But why would you, if you can attain a satisfactory score with so much less effort?

The next layer of the game's rhetoric unfolds more slowly. The fact is that you can't really convey the extent of the hardships faced during a long, underpaying shift on a factory line in any medium. (You could craft a time-accurate simulation, but it would be difficult to rope many into playing it.) Instead, Sweatshop's strategy is to pull you into the antagonist's mindset; it forces you into the cold logic of sweatshop management and leaves you to reflect on your own descent into it. In the design of Sweatshop, Parkin and the others at Littleloud struck upon what Ian Bogost calls "tight coupling." According to Parkin:

It was one of those rare cases where the mechanics and the message seemed to align neatly, and once we began speaking to experts in the field of sweatshop labor it became clear that there was a huge amount of relevant content that we could bake into the game mechanics.

Baking in real-world content

Essentially, the game begins as a cartoon sketch of factory labor. You don't need to worry about worker fatigue, safety and morale. But Littleloud gradually "bakes in" more and more of this real-world content. By the end, you need to keep the floor stocked with water coolers, repairmen and fire marshals to keep your workforce alive.

And then, if you're taking the game seriously, you really start to hold it against them. You cut corners, gambling on the low odds that one or two workers outside the repairman's safety zone might harm themselves. Instead of blaming yourself for demanding too much from them, or for not planning ahead in your support item infrastructure, you get angry at your sim-workers for getting tired at the most inopportune times. It is this reduction of human beings to numbers, pesky weak flesh in the way of the profit, that is Sweatshop's frightening strength.

Of course, not everything about Sweatshop works as well as it could. For instance: radios, fans and portable toilets all contribute in some way to worker productivity. While we can certainly see the case for radios increasing morale and fans reducing fatigue, one of the game's factoid texts explicitly critiques many sweatshops for not allowing workers to use the restroom in order to maximize productivity. The support items are so helpful that, at the end of any given level, your floor is likely to look a lot more hospitable than most actual sweatshops would be.

But incongruities such as this are only a minor problem. The biggest obstacle I see is that, because it is so full-featured and modeled after commercially viable tower defense games, Sweatshop's rhetoric burns so slowly that many players might never encounter it. Even if you play to the end, it really requires a desire to attain gold medals on your part for much of its skillful mental manipulation to take effect.

That said, Sweatshop's many animated cut scenes and factual texts will arguably hit harder for the intended teenage audience than they did with me. There's not as much of a direct causal link between the game and the practice of buying cheap clothes (the stated target of the project) as one might like, but it's a huge step in the right direction for Littleloud as a studio.

Although Parkin couldn't provide details on the game's budget, he did offer a timetable for the game's production. It was pitched to Channel 4 last summer, but it didn't enter production until January. The development cycle lasted around six months with a small team of four, though other members of the studio provided ongoing support. These rough numbers attest to the thoroughness and determination of both Littleloud and Channel 4, showing what can be done when one waits until a game is fully realized before pushing it to press.

On Wednesday, less than 30 minutes before Apple announced another record-breaking quarter of financial results, the Wall Street Journal published a story by Yukari Iwatani Kane, Joann S. Lublin, and Nick Wingfield regarding the issue of Apple CEO succession. (You can circumvent the WSJ paywall using this link, which allows access to anyone coming to the story from Google.)

Here’s the nut of it:

Since Steve Jobs went on medical leave this winter, some members
of Apple Inc.’s board have discussed CEO succession with
executive recruiters and at least one head of a high-profile
technology company, according to people familiar with the matter.

The conversations weren’t explicitly aimed at recruiting a new
chief executive and were more of an informal exploration of the
company’s options, said these people. The directors don’t
appear to have been acting on behalf of the full board, some of
these people said. Apple has seven directors, including Mr. Jobs.

It is also unclear whether Mr. Jobs was aware. In response to
questions from The Wall Street Journal about the discussions, Mr.
Jobs said Monday in an email, “I think it’s hogwash.”

As I wrote when the story broke, to say that the timing of the publication was suspicious is an understatement. Everyone knows the question of succeeding Jobs is attached to dynamite. He cannot be replaced, but, inevitably, someday will be. If Jobs steps down as CEO at any point in the foreseeable future, the company’s stock price is almost certain to take some sort of hit. I can’t see how a speculative and sketchily-sourced story such as this, published 30 minutes before Apple announced overwhelmingly positive financial results, was not intended to dampen, to some degree, the positive effect of those results on Apple’s stock.

Regarding my description of the story as “sketchily-sourced”: the only attribution in the story is “according to people familiar with the matter”. That could be anyone. A good source would be one or more of the purportedly rogue board members. A dubious source would be, say, simply an executive headhunter who claims to have been approached by members of the Apple board, or the “head of a high-profile technology company” — i.e. perhaps an Apple competitor. I find it hard to believe any member of Apple’s board would speak about such an effort to reporters. There are no names in the story whatsoever. No board member, no headhunter, no supposedly-considered outside candidates for the job. None.

The more I think about this story, the worse it looks. Here’s what gives credence to Jobs’s dismissal of it as “hogwash”: there is no one from outside Apple who could credibly replace Jobs as CEO of Apple. If Jobs steps down in the foreseeable future, his replacement will come from within the company.

A new Apple CEO would need credibility and the ability to instantly instill confidence with two highly disparate groups: Apple’s rank-and-file employees, and Wall Street. The only candidates who could satisfy both factions, to any degree, already work at Apple. Name one outsider who’d be accepted both inside the company and on Wall Street. I can’t. Not one.

Apple employees respect and cultivate great design above all else. No other company in technology reflects this ethos. There is no other company like Apple. An exodus of talent from the company would be utterly devastating. Everyone on Apple’s board of directors must know this. It’s completely obvious.

Names I’ve seen bandied about as potential outside successors:

Eric Schmidt. Zero chance. Schmidt is viewed throughout Apple as a traitor, who perhaps used his knowledge of the iPhone, gleaned while then a member of Apple’s board himself, to give Google’s Android effort a leg up. There is a better chance of Apple choosing its next CEO through a raffle of ten golden tickets hidden inside iPad boxes distributed around the globe than that they’d give the job to Eric Schmidt. Wall Street might accept him but Apple rank-and-file would revolt.

Anyone else from Google. No credibility within Apple regarding design, no experience with hardware products.

Jon Rubinstein. Rubinstein left Apple in March 2006. He did good work at Palm as CEO — their WebOS products are far better than the junk they were making when he joined. But why would Apple hire back as CEO someone who left the company a year before the iPhone and whose post-Apple track record is producing failed iPhone competitors? How could Apple pass over the executives who’ve helped create the iPhone, iPad, iOS, and the App Store for someone who wasn’t there for any of it? I still hope Rubinstein and HP pull it out, and I think they can. But the bottom line is that Rubinstein is now a competitor.

Tony Fadell. Nope.

Jeff Bezos. The best answer I’ve seen, but I can’t imagine him wanting to leave Amazon for any other company. Amazon is shaped in Bezos’s image. And Amazon — although a company I think most Apple folk greatly respect and frequently patronize — doesn’t exactly have a reputation for producing Apple-caliber user interfaces or hardware.

Larry Ellison. Same as Bezos. Not going to leave the successful company he founded and built; no record of producing Apple-caliber design.

Anyone from Microsoft. No credibility, period. The one and only reason I can think of to even consider hiring from outside Apple would be to get someone who already holds or has held the title “CEO”. Gates or Ballmer at Apple? Come on.

Woz. Beloved within Apple, but he’s been out of the game for decades, and, let’s face it, is a bit of a flake.

Jean-Louis Gassée. A smart guy, and he gets how Apple works and understands great design. But his chance to lead Apple was in 1996, and everyone knows it. How could Apple pass over its own executives who’ve been at the company throughout the past decade for someone they passed over 15 years ago?

Guy Kawasaki. No recent relevance to anything related to Apple. Little credibility among current Apple employees, none on Wall Street.

Jack Dorsey. Square suggests he has an Apple-caliber design eye, but neither of his companies, Twitter nor Square, has made a dollar of profit. Apple generates over $500 million in profits per week. Dorsey may well be the industry’s next Steve Jobs, but he can’t be the next Apple CEO.

The Only Credible Candidates

Everyone wants this to be an interesting story, but it’s not. There is no intrigue. If Jobs steps down in the foreseeable future his replacement will almost certainly be Tim Cook. Utter credibility on Wall Street, and much respect within Apple. He’s already run the company while Jobs has been on leave. The knock against him is that he’s an operations and finance guy, not a product design guy. Ideally Apple would find someone just like Steve Jobs, but there exists no such person. There will not be a next Steve Jobs. There will be a next CEO.

Read what Tim Cook has said about Apple over the past few years. He is anything but a typical operations and finance guy. He’s an operations guy who understands how Apple works and why it has succeeded, and what it needs to keep doing to continue growing. Cook cannot do what Jobs does, but no one else can either. And Cook, I think, is not only aware of that, but he’s comfortable with it. The obvious structure for a post-Jobs Apple has Cook as CEO, doing mostly what he’s already been doing as COO. What he already does at Apple is what most CEOs do at other companies. Final word on product design goes to the senior vice presidents: Scott Forstall (iOS), Jonathan Ive (hardware design), and Phil Schiller (marketing and, perhaps, Mac).1

Those three men are the only other credible candidates for the job than Cook — and one gets the distinct impression that Ive has no interest in the limelight that would accompany the post. And I don’t see how Forstall or Schiller could be offered the gig unless Cook was on board, satisfied remaining as COO.2 Because if Cook were passed over and in response left Apple, that’s the sort of thing that could trigger a stock collapse on Wall Street.

Things would be different if Apple weren’t both larger and growing faster than all of its competitors. But they are. Apple has different values than its competitors, and everyone in the company believes that it is because of these differences, not despite them, that Apple has achieved its current success. The last thing Apple needs is a shake-up or a dose of what any of their competitors are drinking.

Put another way, the obvious structure for a post-Jobs Apple is simply Apple as we know it, without Steve Jobs.

There is no reason to assume that the next CEO of Apple will also serve as the public spokesman for the company at product introductions and WWDC keynotes. Steve Jobs has served that role not because he’s the CEO but because he’s the best at it. ↩

Cook has so much credibility on Wall Street that effectively, the board might have to offer him the job. Perhaps this entire article could be replaced with, “Look, it’s going to be Tim Cook, and that’s that.” ↩

I finally got around to watching Benjamin Cousins' (EA) excellent but lengthy talk about paying to win. In great detail and with disarming honesty Ben tells the story of how Battlefield Heroes was changed in December 2009 from a Free2Play game with just fluff and convenience items to a "pay to win" game. Weapons for real money were introduced that were better than any weapons you could get by playing, and simultaneously it was made harder to play for free. The users on the forums were extremely upset, and the press echoed the forum posters feelings and declared that EA had ruined Battlefield Heroes.And if we wouldn't have the data Ben revealed in his talk, this is what we might have believed, that EA ruined the game. But the data show something completely different: There was no measurable negative impact on player numbers from all that uproar, both the amount of new players coming in and of old players leaving remained constant. And financially the move was a huge success instantly doubling revenue of the game, and turning it from a game losing money to one making a healthy profit. Which also means turning it from a game threatened with closure to a game that will stick around.Further data analysys showed that the forum posters only represented 2% of the player base, that they spend 10 times more money on the game than the average user, and that they lied when they said they'd quit over this move. Ben even shows some hate mail he got, where he tracked the players and found that in spite of the hate, the players spent more on the game after the change. Thus when the CEO of CCP recently commented the uproar of the EVE community on a similar issue with "I can tell you that this is one of the moments where we look at what our players do and less of what they say", he was completely right. The forum lies.This goes beyond Anil Dash's insight that if your website's full of assholes, it's your fault, suggesting stronger forum moderation. It tells you that people posting on forums are passionate about their game to such a extreme, that what they are saying is actually not relevant any more. There is no connection between the outcry of the 2% of forum posters, and what the other 98% think. There isn't even a connection between what the 2% say and what they themselves do. Trying to get useful information about a game from a forum poster is like trying to get an overview of how some modern religion is from its most crazy religious nutters. The forum lies, and is not be taken seriously as a source.And of course the same applies to blogs. Doubly, because bloggers aren't representative of the player base, and the commenters on a blog are neither representative of the players, nor even of the readers of that blog. Most simple statements you can read on a blog or its comment section, like this or that feature or this or that game "sucking", are completely irrelevant. The more visibly angry the poster is, the more likely it is that his rant isn't representative of anything except his own anger. Which might not even be related to the game he is ranting about. Where blogs beat forums on the other hand, is that on a blog you are more likely to find actual rational arguments for a point of view, or original thoughts. Even in the comments section sometimes. Maybe the opinion is not representative, but if somebody manages to pull of constructive criticism (a rarity on the internet), this can be a source for ideas on how to improve a game. But to know whether something works or doesn't work, you still have to try it out and watch what your players actually do, and how their behavior actually changes in response to the changes to the game.Tobold's MMORPG Blog

In the course of preparing my statements for the Economist journalism debate, I reviewed a bunch of recent, useful studies and surveys. It took a while to dig these up, so I thought I'd provide a list here (in no particular order) in case anybody needs it in the future.

Federal Communications Commission, The Information Needs of Communities (2011)

Congressional Research Service, The U.S. Newspaper Industry in Transition (2010)

Knight Commission on the Information Needs of Communities in a Democracy, Informing Communities (2010) and Re-imagining Journalism (2011)

Media Standards Trust, Shrinking World: The decline of international reporting in the British press (2010)

American Journalism Review, Statehouse Exodus (2009) and Abandoned Agencies (2010) and Retreating from the World (2011)

Columbia Journalism Review, The Reconstruction of American Journalism (2009)

The Guardian, Stop Press (UK regional journalism survey) (2009)

Global Journalist, Is the Foreign News Bureau Part of the Past? (2010)

Human Rights Watch, Whose News? (2011)

Pew Research Center's Project for Excellence in Journalism offers many studies, including its annual State of the News Media reports and News Leaders and the Future (2010)

I tend to spend a good amount of my time continuing to learn WordPress and improve the ways I go about coding themes. With the vast majority of my WordPress development being done for clients, it is important to me to keep a good relationship with them. I feel part of maintaining that relationship is to provide a seamless, simple, and easy solution to their website project. I refer to this as the “Don’t make me think” approach, which pairs nicely with “Just because you can, doesn’t mean you should”…

In most cases, clients spend most of their time adding/editing content in the editor. It is then important to keep things simple yet provide as much functionality as possible. If your clients or users are anything like mine, more than likely they don’t spend the vast majority of their time cleaning code in their favorite text editor and are probably not catching up on their RSS feed full of their favorite web related sites just before they go to bed at 2 am like the rest of us. Clients also get confused when they hear “It’s as simple as adding a class to the element” when trying to create the desired green glossy web 2.0 button. Usually this will lead you to a variety of blank stares as their idea of a class and elements is a room of kids and the periodic table.

Basically, for me to expect my clients to know, remember, and filter through the HTML to add a class to an anchor tag, buried in the middle of the text, is not my idea of a seamless, simple, and easy solution. This goes without mentioning the sometimes bizarre and crazy markup that can be made by the visual editor in the first place (insert previous “cleaning code” remark here ____).

So then, how can the client or user make that link look pretty and green, with rounded corners, a text shadow… and the groovy gradient gloss effect?

SHORTCODES!!! … or simply select the style from a drop down menu within the visual editor.

Implementing A Custom Styles Drop Down Menu
The first alternative up for debate is to provide a custom styles drop down menu. This method is simple to implement for developers and simple to use for users. This is by no means revolutionary as it has been done before, but it is certainly effective. Part of the beauty of adding a new styles drop down into the editor is:

The client does not have to remember a class name, or a shortcode name for that matter… both of which are usually found written down on a yellow post-it-note stuck to the outside edge of their monitor. I have an alternative for this as well that will be covered in another article.
It’s inside the visual editor. No need for the HTML view and code sifting.
It’s a common practice and recognized functionality.
“Don’t make me think” rule applied.

Below is the code necessary to implement a simple styles drop down box.
/**
* Filter TinyMCE Buttons
*
* Here we are filtering the TinyMCE buttons and adding a button
* to it. In this case, we are looking to add a style select
* box (button) which is referenced as "styleselect". In this
* example we are looking to add the select box to the second
* row of the visual editor, as defined by the number 2 in the
* mce_buttons_2 hook.
*/
function themeit_mce_buttons_2( $buttons ) {
  array_unshift( $buttons, 'styleselect' );
  return $buttons;
}
add_filter( 'mce_buttons_2', 'themeit_mce_buttons_2' );

/**
* Add Style Options
*
* First we provide available formats for the style format drop down.
* This should contain a comma separated list of formats that
* will be available in the format drop down list.
*
* Next, we provide our style options by adding them to an array.
* Each option requires at least a "title" value. If only a "title"
* is provided, that title will be used as a divider heading in the
* styles drop down. This is useful for creating "groups" of options.
*
* After the title, we set what type of element it is and how it should
* be displayed. We can then provide class and style attributes for that
* element. The example below shows a variety of options.
*
* Lastly, we encode the array for use by TinyMCE editor
*
* {@link http://tinymce.moxiecode.com/examples/example_24.php }
*/
function themeit_tiny_mce_before_init( $settings ) {
  $settings['theme_advanced_blockformats'] = 'p,a,div,span,h1,h2,h3,h4,h5,h6,tr,';

  $style_formats = array(
      array( 'title' => 'Button',         'inline' => 'span',  'classes' => 'button' ),
      array( 'title' => 'Green Button',   'inline' => 'span',  'classes' => 'button button-green' ),
      array( 'title' => 'Rounded Button', 'inline' => 'span',  'classes' => 'button button-rounded' ),
      
      array( 'title' => 'Other Options' ),
      array( 'title' => '&frac12; Col.',      'block'    => 'div',  'classes' => 'one-half' ),
      array( 'title' => '&frac12; Col. Last', 'block'    => 'div',  'classes' => 'one-half last' ),
      array( 'title' => 'Callout Box',        'block'    => 'div',  'classes' => 'callout-box' ),
      array( 'title' => 'Highlight',          'inline'   => 'span', 'classes' => 'highlight' )
  );

  $settings['style_formats'] = json_encode( $style_formats );
  return $settings;
}
add_filter( 'tiny_mce_before_init', 'themeit_tiny_mce_before_init' );

Now, to apply our green button style to a link, all the user has to do is highlight the links text and select the “Green Button” style from the new drop-down. This link will now take on the simple and universal CSS-based button style set in your themes stylesheet. There is various methods to doing this. Instead of a span tag for the button, you could use an “a” tag. Play around and see what you think.

Take It Another Step Further with Editor Styles
So now we have made things easier for our users to style elements without having to touch any code or add a single shortcode. Let’s take things one step further and add those styles to the visual editor so the users can see the results. To do this, we will simply add a few lines of code to the functions.php and create a new stylesheet for the editor to use.

/**
* Add Editor Style
*
* This provides the theme with the functionality to add a custom
* TinyMCE editor stylesheet. By default, the add_editor_style() will
* look for a stylesheet named editor-style.css in your theme. Here
* we have chosen to define our own stylesheet name, style-editor.css.
* This stylesheet can be named whatever you want, just be sure it is
* defined in the function below and included in your theme files.
*
*{@link http://codex.wordpress.org/Function_Reference/add_editor_style }
*/

function themeit_add_editor_style() {
  add_editor_style( 'style-editor.css' );
}
add_action( 'after_setup_theme', 'themeit_add_editor_style' );

By providing the add_editor_style() function, we are telling WordPress the theme is including a custom TinyMCE editor stylesheet. Now we can include any custom styles the theme may use into a css file called style-editor.css, which we defined in the add_editor_style() function. By default, if a stylesheet name is not defined here, WordPress will look for a file called editor-style.css. I usually change the name to style-editor.css for organizational purposes so the file is listed next to my style.css file. For a great starting point, take look at the Twenty Eleven theme’s editor-style.css file.

Down the Road…
I have a few other, possibly more advanced methods, I would like to share down the road regarding this topic of shortcode alternatives. These methods are a little more robust and allow for more advanced styling to elements. For the sake of an already lengthy article, I’ve decided to split it up into multiple “Parts”. In short, these methods include the use of Quicktags, Advanced TinyMCE Buttons, and “Smart” Editor styles. If your like me and prefer to dig around in code to figure things out on your own, all these methods are currently used in the Debut Theme on Press75.com.

Tomorrow, Mac OS X Lion will be released. And therefore, tomorrow, John Siracusa’s massive Lion review will likely be published on Ars Technica. Since it’s a long web article, a lot of people are going to save it for reading later with Instapaper.

It’s going to be split into a lot of pages. His previous Snow Leopard review was 23 pages.

Nearly all of Instapaper’s competitors, even including Safari’s built-in Reader feature, offer automatic multi-page fetching and stitching into one long page. To date, I’ve intentionally not offered this feature on Instapaper. I’ll seek out publicly available “single page” links and automatically fetch those instead, but I don’t create a single-page view that doesn’t otherwise exist publicly on a publisher’s site.

I’ve been torn about this for a while, since I’m losing business to competitors because of it. It’s a risky move for me to even talk about it like this. But I feel like multi-page stitching is a tricky line to cross, and for the time being, I don’t feel comfortable crossing it.

Ars Technica sells Premier memberships for $5 per month that include single-page views of articles (among other benefits).

I signed up for a Premier subscription and tested saving the single-page version of the Snow Leopard review with the Instapaper bookmarklet, and it worked great. And if anything unforeseen prevents the single-page Lion review from saving properly, I’ll do my best to tweak it and fix the problem as quickly as possible.

I respect Ars Technica’s choice to keep single-page versions of long articles as a subscriber-only feature. If you want to save John Siracusa’s huge Lion review to Instapaper as one long page tomorrow, please support their business and buy an Ars Premier subscription.

Successful freelancers know that time is money. Efficient task and time management are the key factors for freelancers. One freelancer may simultaneously lead several projects, need to communicate with a dozen of clients, and have numerous deadlines to hit. To turn freelance chaos into prioritized work order, there are many project management tools in the getting things done software market.

However, most project management tools are expensive or don’t meet freelance needs. Let’s face the truth: the majority of freelancers are budget-limited, work in small teams with multiple clients located worldwide, or are scattered all over the country. Thus, freelancers want cheap, ideally free, highly customizable project management solutions for efficient team-working.

Let me introduce 10 free, open source project management products that are likely to fit your freelance requirements:

1. Collabtive
Collabtive

Collabtive is a web-based open source project management suite. A quick look inside shows that Collabtive has all the basic features: milestones, task management, time tracking, calendar. Moreover, you can import Basecamp projects and get RSS updates. Laconic, clean interface can be enriched by paid plugins provided by the vendor.

2. GanttProject
GanttProject

GanttProject is a free cross-platform project management tool. If you are a Gantt chart addict, than give a try to GanttProject. You can set milestones, plan resources, measure results, make reports and share projects.

3. phpCollab
phpCollab

phpCollab is a customizable open source team-working solution. You can manage projects, set tasks, view milestones. Launched in 2002, phpCollab stands out for sufficient online collaboration tools such as discussions, notifications, support requests.

4. phpEasyProject
phpEasyProject

phpEasyProject is invented for small teams. Though the interface is incredibly simple and clean, all the basic collaboration features are packed. You can create projects, set up tasks and manage to-do list. Dotproject includes a report export feature and performance statistics. So you can keep track of all current team activity.

5. Project.net
Project.net

Project.net describes itself as enterprise-level project management software with open code. You can manage projects, collaborate, and use social sharing tools within your team. To tack projects easier, try project templates and dashboards. Besides, Project.net offers paid services like training or top-priority support so you can migrate to the new project management system smoothly.

6. ]project-open[
project-open

]project-open[ is more than just a project management suite. It claims to cover related business areas like CRM, invoicing and payments. Standing close to ERP software, ]project-open[ performs all basic project management tasks. You can manage projects, assign tasks, generate reports and track overall results.

7. Redmine
Redmine

Redmine is a flexible web-platform for project management. Redmine is based on Ruby on Rails framework and has multiple database support: Postgre SQL, SQLite and MySQL. The application is multilingual and available in more than 30 languages. Redmine provides users with Gantt chart, calendar, time tracking features which are essential for project planning.

8. TaskJuggler
TaskJuggler

TaskJuggler is project management software for serious project managers as it’s written on the website. No matter how serious you are, TaskHuggler will help you to manage tasks, project files, analyze project performance. The data is presented in dashboards and charts so you can have all info at your hand.

9. Teamlab
Teamlab

Full Disclosure: I work on Teamlab.

Teamlab is a A-grade free project management software. It has 4 modules: project management, business collaboration, documents processing and instant messaging. You can set tasks, milestones, track project activity and generate reports, share bookmarks and wiki pages with your colleagues, keep your teammates up to date with news and even create a poll. Teamlab has a fully featured document management suite. Users can edit, store and share documents right on the corporate portal. Thus you can get rid of Google Docs or Dropbox/Box.net file uploads.

10. WebCollab
WebCollab

WebCollab is online collaboration platform suitable for freelancers. You can make to-do lists, manage tasks via calendar, and manage projects. WeCollab supports social activity. You can post messages in forums or add new contacts or files for further team work.

  


The world of mobile app development is quickly becoming a crowded and complicated space, especially for those outside of the development niche.

“Which development platform should I use?” “Do I go native or Web-based?” “Which devices should I plan for?” “Can I build my mobile website by hand or should I use a pre-built package?”

The questions are endless.

As a designer, my job is to help my clients answer these questions. I try to stay in the category of “knowing enough to be dangerous,” and I keep tabs on the latest mobile development trends, one being the growing popularity of mobile Web apps.

What Is A Mobile Web App?
A mobile Web app is an app that you access via a mobile browser (such as iPhone’s Safari). It is not a static mobile website. It is designed to work like a native app, but it is not accessible via the App Store or Android Marketplace. You pull it up right from the browser.

Why Create a Mobile Web App Instead of a Native App?
Deciding whether a native or Web-based app is best for your client comes down to the audience they are trying to reach. Mobile Web apps are a good fit if:

Your audience is searching for you primarily from a mobile Web browser;
Users are on a multitude of devices (iPhone, Android, BlackBerry, etc.);
The development team has more skill in HTML, CSS and JavaScript than Objective C, Java, etc.

How To Design A Mobile Web App
Those of you who have designed iOS native apps are used to fixed-width and -height images that are positioned and aligned in the Interface Builder (or using code). Designing mobile Web apps is different: you’re designing for the browser again, just as you would for a typical website.

What does this mean? It means you can take advantage of a lot of cool CSS design tricks. In many cases, you can design an entire interface using CSS instead of images.

Technology Analysis: jQTouch or Sencha Touch?
To help you determine which development platform best fits your project, I’ve done some research on two Web technologies that focus on mobile Web apps: jQTouch and Sencha Touch.

jQTouch is powered by jQuery, a highly popular JavaScript library, and is geared to Web designers and novice Web app developers. jQTouch progressively enhances HTML and CSS so that less capable phones are still able to browse content. The primary method of creating functionality in jQTouch is with HTML and CSS or with jQuery-style event callbacks.

Sencha Touch, on the other hand, is geared more to software developers and has a pure Javascript API for building powerful apps. It is powered by a custom core that is optimized for mobile, which inherently makes the core level in Sencha Touch lighter and better optimized than that in jQTouch. It offers a wider array of features and components and is better suited to mobile developers who are creating apps with advanced layouts, functionality and interfaces.

For myself, I wanted an interface that looked and felt like a native app as much as possible. I decided to go with the Sencha Touch development platform because of its ability to handle advanced layouts and interfaces.

Ultimately, you have to do your own research and answer these questions:

What kind of functionality does the app need?
What technology supports that functionality?
How do the costs of these technologies compare?
What can I afford?
Do I know of high-quality developers of this technology?

Once you have this data, you can make an informed decision on the technology platform for your project.

Where Does This Leave Us Non-Coding Designers?
If you fall squarely in the category of designer, don’t worry. You can still design the interface in Photoshop, as I did in the example below. I leave the CSS beauty to the experts, letting them translate my images into code that looks exactly like my design.

Example Project: The Roookies App
Now, I’ll cover a practical example of how to create a mobile Web app using Sencha Touch. I teamed up with Sencha’s CTO, James Pearce, to design an app called Roookies. Roookies helps Dribbble newbies gain exposure on the network by featuring only rookie artwork.

I designed the Roookies app as I would a native application, using a 640 × 960 iOS design template found on Tapptics. This gives my developer a reference when they create the CSS code that will mimic my images. And for any images that cannot be duplicated via CSS, my developer will slice out and insert transparent PNGs.

Coding the Roookies App
Now I’ll demonstrate how to use CSS, Sass and Compass to style and theme mobile Web applications built with HTML5 and the Sencha Touch JavaScript framework.

An Introduction to Sass and Compass
Sass is an extension of CSS that adds new syntax to allow for things like variables, mixins, nesting, and math and color functions. This makes it much simpler to create CSS that is easy to maintain and that doesn’t repeat itself.

For example, in Sass we can write the following:

$blue: #3bbfce;
$margin: 16px;

.content-navigation {
border-color: $blue;
color: darken($blue, 9%);
}

.border {
padding: $margin / 2;
margin: $margin / 2;
border-color: $blue;
}
When we compile it to CSS, the output will look like this:

.content-navigation {
border-color: #3bbfce;
color: #2b9eab;
}

.border {
padding: 8px;
margin: 8px;
border-color: #3bbfce;
}
This is extremely powerful, because it means we can potentially change color schemes, layouts and more with one set of simple parameters — and assuming that the Sass has been structured well, those changes will cascade throughout all of the resulting CSS. (You can do much more than this, and you should check out the Sass website for more information on how the language works.)

Compass is an extension to Sass, and it provides a whole set of CSS3 mixins and an extension system. It’s particularly useful for handling cross-browser CSS prefixes. Take this:

$boxheight: 10em;
.mybox {
@include border-radius($boxheight/4);
}
This will compile to the following CSS:

.mybox {
-webkit-border-radius: 2.5em;
-moz-border-radius: 2.5em;
-o-border-radius: 2.5em;
-ms-border-radius: 2.5em;
-khtml-border-radius: 2.5em;
border-radius: 2.5em;
}
You can learn more about what Compass brings to the styling process on its website.

Using Sass And Compass With Sencha Touch
Sencha Touch is an HTML5, CSS3 and JavaScript framework that allows you to develop mobile Web apps that look and feel native on iPhone, Android and BlackBerry touch devices.

Because the framework uses Web technology to create apps that run in the browser, these apps can easily be themed using tried and trusted CSS. And because Sencha Touch uses Sass and Compass, we can use these techniques to also create beautiful and elegant themes for mobile applications that were built this way.

For this article, we’ve built a simple Sencha Touch app called Roookies. It uses a JSON API to create a gallery of shots by first-time users of Dribbble, a popular design showcase service. (While we won’t get into how the app was built, you can read a sister article about how it works.)

To follow along here, we recommend you grab a copy of the app’s source code, because it also includes the theming components you’ll need. It’s hosted on GitHub, so you can either fork that repository or simply download it as a ZIP file. An unthemed version of the app is also hosted online; you can try it out with a touch device or a WebKit-based desktop browser.

Before you do any theming on this app, you’ll need to install Compass (which has Sass built in). The command line tool itself is Ruby-based, which means that Ruby is a dependency. If you’re a Mac user, Ruby is already installed on your operating system, and the easiest way to install Compass is as a Gem from the command line:

> sudo gem install compass --pre
(We use the --pre flag to ensure that the latest and greatest version of Compass is installed. Sencha Touch requires version 0.11 or later.)

If you are on Windows or a system that doesn’t have Ruby already installed, then you’ll need to install Ruby and Gem first, using something like RubyInstaller for Windows.

How Sencha Touch Uses Sass
Each component of the Sencha Touch user interface library has its own Sass file, which you can easily take and edit. But sometimes, the easiest changes can be made by altering certain important Sass variables (as we did in the examples above) to make changes globally across the application’s theme.

In the Roookies application, you’ll find a folder named theming. In it, create a new Sass file named mytheme.scss. The .scss extension is the convention for Sass files. In this file you can link to the parts of the Sencha Touch theming system that are used in the Roookies application:

@import 'sencha-touch/default/all';
@include sencha-panel;
@include sencha-buttons;
@include sencha-sheet;
@include sencha-tabs;
@include sencha-toolbar;
@include sencha-list;
@include sencha-layout;
@include sencha-loading-spinner;
The first line links to all of Sencha Touch’s sub-theming files, and the subsequent lines call mixins for the UI elements used in our application. Mixins are really just functions: they basically insert blocks of CSS into your document.

Most of these mixins use a set of global variables to alter the appearance of different parts of the user interface. For example, the $base-color variable modifies the overall color of the application. Set the following variable before the @includes so that they all use this new value, a tasteful green:

$base-color: #709e3f;

@import 'sencha-touch/default/all';
@include sencha-panel;
@include sencha-buttons;
…
When you save that file, you will be good to compile the CSS. In the same directory, run Compass on the command line, like so:

> compass compile mytheme.scss
If all goes well, Compass should output the mytheme.css file in the same directory. As with all websites and apps, you’ll need to reference this new CSS file in the app[…]

By John Anderson


An overview of agile development and working as a designer in agile environments.




What does it mean to have a good experience? Think of your favorite restaurant, the interior of your car, and the software on your phone; how do people craft these experiences? What details, planning, and design go into the process?

Would it be possible to create a great experience if you were limited from laying out a full design before you got started? That’s the typical scenario in designing a user experience within the realm of agile software development. As a designer, how do you manage in an environment with such a quick pace and changing specifications? This article provides a brief overview of agile development and gives several tips for working as a designer in this environment.

read more

Comments

Dean Martin’s recipe for hamburgers. Sounds perfect.

 ★ 

Ricky Gervais, Chris Rock, Jerry Seinfeld, and Louis C.K. deconstruct comedy  

Hot off the O’Reilly presses: Matt Neuburg’s 834-page iOS programming tome. Neuburg is my favorite programming book writer, period.

(Buy it from this link to Amazon and I’ll get the kickback dough; I’d have linked with Neuburg’s Amazon Associates code, but he lives in California so that won’t work anymore.)

 ★ 

  


It’s interesting to look back at our previous WordPress themes round-ups. It’s almost like looking at a visual timeline not only of WordPress’ advances in theme design, but of the rapid development in functionality of the CMS itself. The themes from year to year clearly differ in style as Web design trends have evolved. As each year passes and more functionality is added to WordPress’ core, these improvements are strongly reflected in the themes developed for it.

Once upon a time, all WordPress themes looked like traditional blogs, with basic functionality and not a heck of a lot more. But as you will see from the themes below, that original “blog” design style is clearly gone, perhaps never to be seen again. It makes you feel nostalgic.

Nowadays, user requirements for WordPress themes are very high. Users expect all themes (including free ones) to have pages for admin options built in, where you can quickly set up your website and personalize it with a minimum of fuss. With the rise of these options pages, niche-specific theme designs (such as for portfolios, blogs or magazines) are no longer required and are, in fact, few and far between.

Most of the themes below can be tailored via the options panel to be anything you want, whether a portfolio, a content-heavy magazine-style website or a basic blog. Setting one up takes only 10 minutes. This actually gave us a few problems when it came to categorizing the themes below. We spend a lot of time researching, collaborating on and writing these round-ups. In fact, it is a Smashing Magazine tradition to publish the top 100 WordPress themes from the previous 12 months (this is our fifth edition).

Portfolios, Galleries And Showcases
Portfolium (Demo)
Portfolium is a clean and flexible WordPress grid-based portfolio theme, designed in a modern and minimalist style. It is ideal for designers, artists, photographers and other creative specialists who require a professional portfolio theme.

Shaken Grid (Demo)
Shaken Grid uses the jQuery Masonry plug-in, which “arranges elements vertically then horizontally according to a grid.” The theme is perfect if you need a gallery or portfolio or just want a unique grid layout.

Big Square (Demo)
Big Square is a stylish photoblog theme with a built-in gallery that is focused entirely on highlighting your creative visuals.

Journal Crunch (Demo)
Journal Crunch is a gallery and portfolio theme with all of the features you would expect from a premium theme: easy set-up via the options page, plenty of shortcodes, built-in pagination, Twitter widgets, AJAX contact form and much more.

Paragrams (Demo)
Paragams is a lightweight theme that is built on a grid and that could be used for various types of websites: portfolios, photoblogs even online magazines.

Imbalance 2 (Demo)
Imbalance 2 turns you WordPress-based website to an attractive blog, portfolio or online magazine. This free template has a strictly modern style with a minimalist touch.

Photoria (Demo)
Photoria is a clean feature-rich theme that would be perfect as a photoblog or portfolio. It comes packaged with a variety of templates and built-in SEO (via its extensive options page), and the theme is internationalized for easy translation.

Muse (Demo)
Muse is a simple gallery theme that can be used as either a portfolio or an inspirational showcase. It comes with custom page templates and built-in SEO, and it can be combined with a ratings plug-in to create an all-singing, all-dancing showcase website.

mimiThem (Demo)
This is far and away the most basic theme in this article. But don”t be fooled: it works effectively as a quick and easy way to get your portfolio online.

Dione (Demo)
Dione is a video showcase theme that uses the custom post type feature available in WordPress 3+.

Business And Corporate Websites
Academica (Demo)
Academica was designed specifically for educational institutions such as universities and schools. It’s a flexible and versatile free theme that can be easily customized and branded for any university, academy or non-profit organization.

Rotary (Demo)
Rotary is a two-column business theme that was built with all of the fantastic features of WordPress 3.0. It is centered on the idea of running your blog as a CMS.

Vanadiumitic (the link was removed due to the suspicious code of the theme)
Vanadiumitic comes with a featured content section, a dropdown menu, subscription buttons (Twitter, Facebook and RSS), an automatic thumbnail resizer, and widgets for popular and featured posts and featured videos, all packed in a powerful framework for easy back-end customization.

Aurelius (Demo)

Gameliso (Demo)
This one’s a lovely clean theme.

Zincious (Demo)
The Zincious theme comes with a dropdown menu, subscription buttons (Twitter, Facebook and RSS), an automatic thumbnail resizer, a widget for popular posts, a featured content slider and a robust framework for easy back-end customization.

Ikonik (Demo)
Ikonik was designed as an online design store, although no e-commerce system is integrated. It could be used as a simple portal for selling vectors, icons, logos, buttons, themes and pretty much anything else.

Minimalist Themes
Expositio (Demo)
Expositio is a simple portfolio theme for photographers, designers and artists. Its integrated options help you customize the template from font to color.

Sutra (Demo)
Sutra is a minimal theme focused on simplicity, putting the writing front and center.

Extricate (Demo)
Extricate is a clean, minimal theme built on HTML5 and CSS3. The options page allows you to resize columns and specify post information.

Renova (Demo)
Renova comes with two backgrounds (full white or paper), six link colors, jQuery support for hover effects and mobile device support. The minimal style is for writers who need a simple layout without any distraction.

Feijoa (Demo)
This is a four-column layout with a simple sidebar and was designed using the jQuery Masonry plug-in.

Simply Delicious (Demo)
This minimalist theme features big images, a clean style and easy browsing: perfect for modern blogs and portfolios.

Wordfinder (Demo)
Wordfinder is a simple magazine-style theme for users who want to start a blog with a minimal layout. The theme has many layout features, including two home page styles and six colors for links and hover effects that are easily customizable via the options page.

Theophilus (Demo)
This jQuery-based, Cufon-enabled, lightweight and minimal WordPress theme was developed by Timothy Long.

Blogum (Demo)
Blogum is a simple grid-based blog theme, designed with a modern and minimalist style. It supports all WordPress 3.0 features, giving you extra flexibility.

Mini Hyper (Demo)
Mini Hyper comes with a basic options page where you can add your analytics tracking code and change the logo. Other than that, Mini Hyper is widget-ready and works in all browsers.

Min (Demo)
“No bells and whistles, just simple and to the point.” Min’s main content area is set at 560 pixels, and it has two widget-ized footer areas to handle navigation and anything else you feel like putting there.

Papaver (Demo)
Papaver is an elegant, minimal theme. You can set the content to one, two or three columns.

Codium Extend (Demo)
Codium Extend is a minimalist theme that supports all of WordPress 3+’s features and comes with support for smartphones (iPhone, etc.) and tablets (iPad, Galaxy Tab, etc.).

Delicate (Demo)Delicate is a clean, minimalist theme with a focus on typography and structure.

Melville (Demo)
Melville was inspired by classic literature. It has no distractions; just a simple design that focuses the reader on your writing.

Fresh and Clean (Demo)

Yoko (Demo)
Yoko is a modern and flexible theme, with a responsive layout based on CSS3 media queries. The design is optimized for big desktop screens, tablets and smartphones. You can use new post formats (such as Gallery, Aside and Quote), choose your own logo and header image, and customize the background and link color.

Hybridside (Demo)
With a minimal design and simple structure, Hybridside allows writers to choose the body background and the color scheme for links. It has full support for thumbnails, WordPress menu navigation, five widget areas and a print-friendly style sheet.

Aqualine (Demo)
Aqualine is a unique and minimalist theme that has an extensive options page. Pick your own color accent, choose between thumbnails and excerpts or the full content for the main page, and more.

The Scoop (Demo)
The Scoop is a four-column minimal magazine-style theme, with a focus on elegant typography. It is ideal for content-heavy websites.

David Airey Theme
David Airey has released his old blog’s design as a free WordPress theme. As you probably know, that minimal design offers the perfect platform for your writing.

The Columnist (Demo)
The Columnist was inspired by the grid structure and typographic techniques of traditional newspapers. It was designed with a grid-based layout, an elegant typographic hierarchy and some CSS3 and jQuery greatness.

Swiss Dessign (Demo)The four themes below, originally featured on Smashing Magazine in January, are simple yet powerful, with a touch of traditional Swiss design and layout. Their distinct style is what separates them from the other themes. They allow you to select the focus of your work, since you are the artist and should be in control of the visitor’s experience. Each theme comes with a full video overview and support for using and managing it.

Studio Dessign (Demo)

Minimal Dessign (Demo)

Style Dessign (Demo)

Simplest Free WP Theme
This is perhaps the most basic WordPress theme you’ve ever seen. It’s so basic that it’s not even worth showing a screenshot of it. But it is useful. It’s a fully functional theme that would be perfect for anyone looking for a barebones WordPress framework. It has onl[…]

Digital media not only forces newsrooms to face economic challenges, but also workflow issues. In a recent post, Todd Benoit, director of news and new media at the Bangor Daily News addressed the root of the workflow problem in his newsroom:

Like many newsrooms, until very recently we were production heavy because we had to be. Moving stories to the web was a copy-and-paste affair, but that's not where the trouble started. If you begin with a print-directed front-end system, as we did, how does that system accommodate a story being updated from the field? Or how would the full possibility of story assets land online, to be chosen among for print? Even simpler: When do reporters add links? The answers, as countless journalists know, are: It can't; they won't; they don't. From there, it's all production, not creation.

The Bangor Daily News attacked the problem head on, incorporating Google Docs and WordPress into a new front-end system that handles the flow of news in the digital era. As Benoit describes the solution:

... the guiding ideas we have put into practice are to match the tool to the job we need done (rather than the reverse), reduce the number of steps required and anticipate how our audience will want the information next. And the cost should be next to nothing.

To find out more about how the project came about and how it works in practice, I reached out to William Davis (@williampd), the online editor at the Bangor Daily News and the architect of the new system.

Our interview follows.

How did you end up gravitating toward a Google Docs / WordPress / InDesign system?

William Davis: My boss [Todd Benoit] has a great post on our dev blog on the topic, and I talk about it a bit on one of my blog posts as well.

We picked Google Docs purely for its ease of use and its collaboration tools. We wanted a place where reporters could work on their articles easily from wherever they are — we have quite a few bureaus, and our reporters often file from events. The collaboration tools are terrific and have really proved useful, for example, when we're editing articles on tight deadlines or when reporters are working on stories together. On Election Day we had three reporters at different campaign headquarters all working in one doc, and it went very smoothly.

We chose WordPress because we wanted a content management system (CMS) that allowed us to develop components quickly and easily. WordPress has a great API and it's very extendable — we've been able to easily change pretty much any part of the CMS without hacking the core, which allows us to maintain the integrity of the system.

Both systems are quickly evolving and pushing boundaries in their fields, without any prodding from us. WordPress has frequent updates that push the platform to a new level, and Google Docs' collaboration tools, for example, are second to none.

Finally, we chose InDesign because it is the industry leader in page design software.

TOC Frankfurt 2011 — Being held on Tuesday, Oct. 11, 2011, TOC Frankfurt will feature a full day of cutting-edge keynotes and panel discussions by key figures in the worlds of publishing and technology.

Save 100€ off the regular admission price with code TOC2011OR

What was involved in developing the system?

William Davis: We started development in August [2010] or so, and it's still ongoing. We launched things on a rolling basis by department, and started with sports, which turned out to be the hardest because it's the most complex. We then rolled out politics in time for the elections. We got the entire newsroom using Google Docs early this year.

The display desk transitioned to InDesign in April, and then earlier this month we finished the website transition and turned off our old systems. As we developed the components needed for each department, we would move them over, test and tweak things, and then move on to the next department.

What are some of the major challenges you've encountered?

William Davis: We've had a few instances where Google has changed the way they structure their content in Google Docs or changed the way a part of the API works and we've had to adapt. We've also faced the usual technical problems that come with hosting any large website, but we haven't really encountered any challenges that we weren't able to solve fairly quickly.

Some components we've rebuilt a few different ways and will probably rebuild again. The wire feeds are an example. Those were originally running directly into WordPress. We decided we didn't want to put the strain of tens of thousands daily stories and photos on our website and so we tried running the wires directly into Google Docs. We encountered problems there, as well. I`n the third iteration, which we're using now, we have a separate script that ingests the wires and provides a way to browse them, then sends the stories we want into Google Docs. That's worked pretty well, though that's not to say we won't rebuild that component or others in the future as needed.

The great thing about building our own system is that we can tailor it to our needs. Because we're doing it all in-house, we can change quickly, rather than waiting for a corporation to adapt with us.

Was it difficult for people to adapt to the new system?

William Davis: With a transition to any new system, there are of course going to be problems, but I think the ones we've encountered have been pretty minimal. Reporters seem to have had a pretty easy time adapting to writing in Google Docs — many of them, especially bureau reporters, were already using the system to write their articles. They understand why it's important to move content quickly through the system so their articles have the best chance to succeed online.

Can you give us a walk-through of the publishing steps involved — from story idea to final web and print versions?

William Davis: Reporters start their stories in Google Docs, and when they're finished, they drop them in a folder for their section — Metro, State, Business, etc. Editors read the story and move it on to a copy editing queue, where a digital desk editor reads it before sending it to WordPress.

In WordPress, the digital desk editors will categorize it, attach media such as photos and video, and then they will publish the story. This is done throughout the day — we have digital desk staff on from 5 a.m. until midnight. When the display desk comes in to lay out the paper, all they have to do is find the story in the InDesign plugin we built and bring it onto the page.

Everything comes onto the page fully formatted, though the digital desk is responsible for writing their own headlines for print. They can do this either on the page or in a module I built for WordPress that provides a WYSIWYG headline-writing interface.

Davis offers a tour of the new system in this screencast:

How many people actually touch the copy before it's published?

William Davis: As is the case in any newsroom, that varies by article. The digital desk editors, in addition to being copy editors, sometimes act as backfield editors, such as on the weekend. Other articles are seen by four or five editors before they're published. In general, though, articles go from reporter to assignment editor to at least one digital desk editor before being published.

How much manual labor is involved?

William Davis: We've managed to do away with pretty much all manual labor. Previously, all stories were written in our print CMS, and the web staff was responsible for copying and pasting the story into our web CMS, finding and adding links, writing a web headline and, quite often, doing that multiple times for the same story after it was updated. The copy editing was all print-centric, so at the end of the night, most of the stories would need to be updated. Now there's no copying and pasting — everything flows from one step to the next.

Related:

WordPress as Book Publishing Platform

The line between book and Internet will disappear

Metadata isn't a chore, it's a necessity

Writing a Book with Google Docs

The secret to digital publishing success? Don't start with the book

Yep.

Update: Fireballed; cached here.

 ★ 

  


Let’s assume you have built a nice little Ruby on Rails application on your local development machine. Now it’s time for the application to go live. But where should you host this application? You know that you (or your client) do not have much money to spend, and so you look at the options. You notice right away that managed hosting of applications tends to be relatively expensive. Heroku is a good option, but it doesn’t give you storage space, and more importantly, it lacks full control. Luckily, you have a suitable alternative: a VPS.

This tutorial will help you get through the steps required to set up an Ubuntu VPS that is capable of hosting (multiple) Ruby on Rails applications. This tutorial builds on part 1, “Set Up An Ubuntu Local Development Machine For Ruby On Rails.” We recommend that you follow that part first and use the same Ubuntu local development machine that you set up there to walk through this part.

Wait… A VPS?
VPS stands for virtual private server. It is a virtual machine offered by Internet hosting companies. With a VPS, you get your own virtual slice of real estate that lives with other virtual slices on one physical server. This virtual machine is capable of running an operating system, a Web server and database software. A VPS comes with full control (or root access) and, with most hosting companies, at a very reasonable price. And because a VPS is capable of running multiple Ruby on Rails applications, the costs of the VPS can be spread.

Quick Overview
In this tutorial, we’ll log into the VPS, add a new user and configure SSH connections so that the VPS is more secure. Then, we’ll install Ruby and RubyGems using the Ruby Version Manager (RVM) script. In turn, we’ll install Rails and Capistrano using RubyGems. And then we’ll install Passenger and take care of the Nginx Web server installation. The VPS will also feature a PostgreSQL database.

At the time of writing, the latest versions are Ubuntu Server 10.10, Ruby 1.9.2 and Rails 3.0.7. These steps were also tested on Ubuntu Server 10.04 and the upcoming Ubuntu Server 11.04 release.

During this tutorial, we will make extensive use of the Linux command line. A short glossary at the end of this tutorial describes the relevant Linux commands.

Up And Running
First, find a suitable host and purchase your VPS (if you don’t have one already). Make sure the host allows you to install Ubuntu on a VPS; most hosting companies will because it is a popular choice for VPS’. I chose a 512 MB VPS, which should be sufficient to run multiple small Ruby on Rails applications.

For those without a VPS, you can still follow along using virtualization software like VirtualBox. VirtualBox is open-source software and available in the Ubuntu Software Center or via the official website. Make sure when setting up your virtual machine that your network adapter is set to “Bridged” (Right click → Settings → Network → Attached to: Bridged Adapter). This way, your virtual machine will get its own IP address on your local network. Just install a fresh copy of Ubuntu Server, select “OpenSSH server” during installation, and skip the next two steps. You can log in directly via the VirtualBox window or, if you know the IP address of the server, via SSH.

Log into your VPS host’s control panel, and install a fresh copy of Ubuntu Server. Make sure to submit a safe “root” password, and boot the VPS.

Log Into Your VPS
We’ll log into our VPS using SSH. SSH stands for secure shell and is a network protocol. It enables computers to communicate via an encrypted connection.

I assume you know the IP address of your VPS (if not, look it up in your host’s control panel), and that “root” is the default user, and that you know the “root” password, and that SSH is installed.

While using the domain name of the VPS is technically possible, we will log in using the VPS’ IP address. Setting up the domain name of your VPS is very context-specific and beyond the scope of this tutorial.

Now open up a terminal window on your Ubuntu local development machine, and log into your VPS:

$ ssh default-user@vps-ip-address

For example:

$ ssh root@123.456.7.890

You might have to type yes and then provide the “root” password. In about a second, you should be logged in.

Secure Your VPS
For security reasons, you should do as little as possible as “root.” So, we’ll create a new user and assign administrative rights to it. To make use of its administrative rights, the user needs to explicitly invoke the “sudo” command, which adds a security layer to the system administration. First, create a new user:

$ adduser your-user-name

For example:

$ adduser johndoe

Provide a safe password (filling in the user details is optional). Now, make the new user a member of the “admin” group, which grants the user administrative rights (by invoking the sudo command).

$ adduser your-user-name group-name

For example:

$ adduser johndoe admin

Securing your SSH (server) configuration is the next step. Because every Unix system has a “root” user by default, you should disable “root” from logging in using SSH. This makes your system less vulnerable to brute force attacks.

$ nano /etc/ssh/sshd_config

Set PermitRootLogin to no, and reload the SSH configuration so that the changes take effect. Although “root” will be disabled from logging in in future, the current “root” user connection will be maintained.

$ /etc/init.d/ssh reload

Now, log out of your VPS as “root,” and log back in as the new user.

$ logout
$ ssh your-user-name@vps-ip-address

For example:

$ ssh johndoe@123.456.7.890

The system is more secure now that a new user has been created and “root” has been disabled from logging in via SSH. Some of the upcoming steps repeat the steps we took in part 1 of this tutorial, while also getting us up to date and installing RVM, Ruby, RubyGems and Rails.

Get Up To Date
Now, let’s get up to date. The first three commands below will, in turn, update the package lists, upgrade currently installed packages, and install new packages and delete obsolete packages. You’ll end up with a VPS that is fully up to date. The final command will reboot the VPS, which is good practice after updating a lot of packages.

$ sudo apt-get update
$ sudo apt-get upgrade
$ sudo apt-get dist-upgrade
$ sudo reboot

Prepare Your VPS For RVM
Wait a minute or so for the VPS to reboot. Once it has, log back into the VPS from a terminal window.

$ ssh your-user-name@vps-ip-address

For example:

$ ssh johndoe@123.456.7.890

The RVM script needs some packages in order to be installed, namely Curl and Git. Curl is a tool to transfer data using a range of protocols (such as HTTP and FTP). And Git is “a free and open-source, distributed version control system designed to handle everything from small to very large projects with speed and efficiency.” Git is the choice for version control among most Ruby on Rails developers.

$ sudo apt-get install curl
$ sudo apt-get install git-core

Install RVM
Now we can install RVM. RVM stands for Ruby Version Manager and is “a command line tool that allows you to easily install, manage and work with multiple Ruby environments, from interpreters to sets of Gems.” The following command takes care of installing the script. RVM will be installed in the home directory of the currently logged-in user:

$ bash < <(curl -s https://rvm.beginrescueend.com/install/rvm)

Navigate to the home directory, and edit the user’s bash profile. This ensures that the RVM script is loaded every time the corresponding user logs in. To edit the bash profile, we use Nano. Nano is a simple command line text editor, and we will use it again in this tutorial.

$ cd
$ nano .bashrc

Add the following line to the end of the user’s bash profile.

[[ -s "$HOME/.rvm/scripts/rvm" ]] && . "$HOME/.rvm/scripts/rvm"

Load the script into the current shell session by reloading the user’s bash profile. This way, the rvm command will be made available.

$ source .bashrc

You can verify whether the RVM script is working by entering the following command:

$ type rvm | head -1

If everything is set up correctly, the shell should return that “rvm is a function.” If it doesn’t, please go over to the RVM website and look under “Troubleshooting Your Install” to see how to make it work.

Prepare Your VPS For Ruby And RubyGems
RVM comes with a handy tool for seeing the dependencies needed to compile and install Ruby and RubyGems from source.

$ rvm notes

Look at the dependencies listed under the regular version of Ruby, and install these. Some packages might already be installed.

$ sudo apt-get install build-essential bison openssl
libreadline6 libreadline6-dev curl git-core zlib1g zlib1g-dev
libssl-dev libyaml-dev libsqlite3-0 libsqlite3-dev sqlite3
libxml2-dev libxslt-dev autoconf libc6-dev ncurses-dev

Install Ruby And RubyGems Using RVM
On the one hand, we have Ruby. It is “a dynamic, open-source programming language with a focus on simplicity and productivity. It has an elegant syntax that is natural to read and easy to write.”

On the other hand, we have RubyGems. It is “the premier Ruby packaging system. It provides a standard format for distributing Ruby programs and libraries, an easy to use tool for managing the installation of Gem packages, a Gem server utility for serving Gems from any machine where RubyGems is installed, and a standard way of publishing Gem packages.”

Like the RVM command described above, there is also a command to see what versions of Ruby are available to install using RVM. Have a look at the available Ruby versions.

$ rvm list known

Install a regular version of Ruby. Because Ruby gets compiled from source, this might take a while.

$ rvm install 1.9.2

Start using the installed Ruby, and set this version as the default.

$ rvm --default us[…]

Today Joe Decker shares some tips on wide angle photography.

One of the first lens purchases aspiring landscape photographers typically made is a wide or super-wide lens, anything (in full-frame 35mm terms) from 24mm on down, and with good reason, wides offer photographers the ability to capture the sweeping vistas of the natural landscape. But they can also be a challenge to use effectively, it’s all to easy to end up with a wide-angle shot that lacks the power and grandeur we felt when we were shooting. In this article, I’ll explain why that’s so often the case, and provide a few tips for working around those challenges, showing you how to use wide-angle lenses to create dramatic, effective images.

Nordenskjöld Lake, Torres Del Paine National Park, Chile. Image Copyright Joe Decker

1. Get Close!
Because wide-angle lenses take in a bigger angle-of-view than other lenses, using a wide-angle lens at the same distance from your subject will render that subject smaller than it would otherwise. To compensate for this, you’ll have to move closer to your subject. Don’t be bashful about getting close, particularly with super-wides&mash;it’s almost impossible to get “too close” to your subject with a 14mm lens. This emphasis in size that wide-angle lenses give nearby objects means that …

2. It’s All about the Foreground
Contrary to what you might expect, this means that the most important element of your wide-angle landscapes is the foreground. While wide-angle lenses do capture the wider landscape, they also (almost inevitably, because of their wide field-of-view) capture quite a bit of foreground as well, and this foreground is emphasized by the wide-angle perspective. As a result, if your foreground isn’t interesting, your photograph won’t be interesting. This leads us naturally to the Josef Muench idea of the near-far composition, an image which uses a wide-angle lens to not only show a broad vista, but also to show one detail of that landscape in an up-close, intimate way. When you’re photographing wide, be sure to spend some time looking for the most interesting foreground available to combine with your grand vista.  (If there isn’t an interesting foreground, you might want to consider using a longer lens to leave out that less interesting foreground.)

Fallen Redwoods, Stout Grove, Jedediah Smith State Park, California. Image Copyright Joe Decker

3. Watch those Verticals!
Wide-angle lenses tend to bend and distort verticals, as you can see in the tree trunks near the top of Fallen Redwoods. Now, you might decide you like that effect, or that you hate it, but it’s important to be aware of it and to make a conscious decision about it. For some images it’s fun to embrace, but more often I find myself having to work to avoid it or correct it later.  Avoiding it can be as simple a matter as composing so that there’s only a single obvious vertical (and that that’s vertical), alternatively, using shift movements with a tilt-shift lens can correct some of this distortion in-camera. Post-exposure, Photoshop’s “Lens Distort” filter can also save the day.

4. Leading Lines
Compositionally, lines (such as streams or railway tracks) leading from the bottom corners of an image towards the center often have a particular magic for guiding the viewers eye through the picture, making for strong images, and this is particularly the case for wide-angle images. Hot Stream is a great example of this, the viewers eye tends to wander from the corner  back through the image along the stream. As the stream moves back into the image, the stream gets smaller (in terms of inches on the printed page) quickly due the wide perspective. This quick fade (in width) into the distance creates a real sense of depth in the image.

Hot Stream, Húsavík, Iceland. Image Copyright Joe Decker

5. Filter Woes
Shooting wide creates two problems for those of us who use filters. Polarizers are a specific problem, the effect of a polarizer on a blue sky varies across the sky so greatly that wide-angle images including the sky are left horribly unnatural, so leave off the polarizer unless you know there’s no blue sky in your scene. Screw-in filters are a separate problem, it’s all too easy for the filter edges, particularly if you’re stacking more than one filter on the same lens. Filter systems, such Cokin’s P-series filters (with the wide-angle filter holder), can help you avoid these problems if you must use filters.

Dwarf Arctic Birch, C. Hofmann Peninusla, Greenland. Image Copyright Joe Decker

6. Focusing
One of the things I enjoy most about working with wide-angle lenses is the ease of focusing them. As you move to wider and wider focal lengths, the depth-of-field at a particular aperture gets deeper and deeper. This allows you to make great use of the concept of hyperfocal distance, that is, the nearest distance you can focus a particular lens at a particular aperture and get “good focus”. At 24mm, by focusing about six feet out from the camera you’ll capture everything from about three feet to infinity in focus—even at f/11. At 17mm, focusing at the right point at f/11 will get you everything from infinity down to 17 inches away. Find (using a web site like this or any of a number of other sites, software tools or printed tables) and write down the hyperfocal distance for a couple of your widest lenses at a couple of your favorite apertures, and you’ll have an easy way of bringing the entire scene of near-far compositions into critical focus.

Using wide-angle lenses can certainly be tricky, but I love them all the same. Used well they can allow the photographer to create images that immerse us in a world with both small, intimate details and bold, dramatic vistas.

Joe Decker is a professional nature photographer and writer for Photocrati’s Photography Blog He also offers nature photography workshops and coaching around the western United States.

Post from: Digital Photography School's Photography Tips. Check out our resources on Portrait Photography Tips, Travel Photography Tips and Understanding Digital Cameras.

6 Winning Ways to Work Wide

This is part of an ongoing series related to Peter Meyers' project "Breaking the Page, Saving the Reader: A Buyer & Builder's Guide to Digital Books." We'll be featuring additional material in the weeks ahead. (Note: This post originally appeared on A New Kind of Book. It's republished with permission.)

I'm looking forward to the free webcast I'm giving next Thursday on digital book-making tools (June 30th; sign-up info here) . There's quite a land grab happening right now, as software manufacturers — new and old — try to become the tool of choice for authors, small publishers, and illustrators. I still haven't finalized exactly which software I'll be talking about, but now seemed like a good time to share a selection of my research notes.

Demibooks Composer

iPad-based app gives authors a touchscreen-based development tool from which they can create an iPad app. You can do things like move objects to indicate motion paths. Ideal for kids' books with lots of illustrations. In private beta, planned release later this summer.

My Story Book for the iPad

Like Composer, this app lets you create kids books on the iPad itself — though with fewer interactive and motion capabilities. Includes basic tools for adding and manipulating text atop photos and illustrations. Beta launching this summer.

Aquafadas

Plug-in tool lets you add interactive and multimedia enhancements to InDesign or Quark layouts. Good for complex layouts featuring a mix of text and images. In limited pre-release.

Active Reader

Plug-in for Unity (high-powered game development program). Flowchart-like user interface lets you program interactivity and motion; especially useful for highly illustrated books like graphic novels.

Atavist's Periodic Technology

Authoring tool lets you add "Inline Extras" (e.g. pop-up character summaries, timelines, maps) to long-form articles that The Atavist specializes in (longer than an article, shorter than a book, they say). Export options include iOS app and stripped down Kindle files. Tool currently in private beta.

Moglue

Desktop app (Mac or Win) for creating interactive iOS and Android ebooks, especially illustration-rich kids books. Open beta starting in July according to their Twitter account.

InteractBuilder

Desktop app (Mac or Win) lets kids book authors create iOS interactive ebooks.

App Press

Web-based tool for creating iOS apps. Early uses include photo histories and cookbooks. Web-based preview tool lets you share in-progress designs. Developer provides InDesign and Photoshop templates for preparing assets before importing into the App Press tool.

Leanpub

Lets you use pretty much any blogging tool to publish an ebook. System accepts RSS feeds, HTML, or Markdown and outputs ePub 2.1, Mobi and PDF. Built-in e-commerce system takes care of sales for author and offers very generous royalty rates (usually about 90%).

This is by no means an exhaustive list. I've looked at, easily, a couple dozen entrants and the ones listed above are mainly there because my notes on them are ready for sharing. My goal for the webcast is to give attendees a guided tour of the main kinds of tools out there, with a look at what feels to me like the most promising tools in each category. Hope you can join in!

Webcast: Digital Bookmaking Tools Roundup — Pete Meyers looks at the growing number of digital book tools: what's best, what's easiest to use, and what's worth putting in your book-building toolkit.
Join us on Thursday, June 30, 2011, at 10 am PT

Register for this free webcast

Related:

10 innovative digital books you should know about
More stories from the "Breaking the Page" project

  


Almost every Web designer can attest that much of their work is repetitive. We find ourselves completing the same tasks, even if slightly modified, over and over for every Web project. Following a detailed website design and development process can speed up your work and help your client understand your role in the project. This article tries to show how developing a process for Web design can organize a developer’s thoughts, speed up a project’s timeline and prepare a freelance business for growth.

First of all, what exactly is a ‘process’? A Web development process is a documented outline of the steps needed to be taken from start to finish in order to complete a typical Web design project. It divides and categorizes the work and then breaks these high-level sections into tasks and resources that can be used as a road map for each project.

A Typical Process
Here is a standard process that was put together using examples from around the Web as well as my own experience. (Note: Please see the resource links at the end of each phase.)

1. Planning
The planning stage is arguably the most important, because what’s decided and mapped here sets the stage for the entire project. This is also the stage that requires client interaction and the accompanying attention to detail.

Requirements analysis
This includes client goals, target audience, detailed feature requests and as much relevant information as you can possibly gather. Even if the client has carefully planned his or her website, don’t be afraid to offer useful suggestions from your experience.
Project charter
The project charter (or equivalent document) sums up the information that has been gathered and agreed upon in the previous point. These documents are typically concise and not overly technical, and they serve as a reference throughout the project.
Site map
A site map guides end users who are lost in the structure or need to find a piece of information quickly. Rather than simply listing pages, including links and a hierarchy of page organization is good practice.
Contracts that define roles, copyright and financial points
This is a crucial element of the documentation and should include payment terms, project closure clauses, termination clauses, copyright ownership and timelines. Be careful to cover yourself with this document, but be concise and efficient.
Gain access to servers and build folder structure
Typical information to obtain and validate includes FTP host, username and password; control panel log-in information; database configuration; and any languages or frameworks currently installed.
Determine required software and resources (stock photography, fonts, etc.)
Beyond determining any third-party media needs, identify where you may need to hire sub-contractors and any additional software you may personally require. Add all of these to the project’s budget, charging the client where necessary.

Resource links for this phase:

Jumpchart: Client/developer collaboration tool
Dropbox: File-sharing and collaboration tool
Mindmeister: Free online mind-mapping software
Writing Bulletproof Web Design Contracts

2. Design
The design stage typically involves moving the information outlined in the planning stage further into reality. The main deliverables are a documented site structure and, more importantly, a visual representation. Upon completion of the design phase, the website should more or less have taken shape, but for the absence of the content and special features.

Wireframe and design elements planning
This is where the visual layout of the website begins to take shape. Using information gathered from the client in the planning phase, begin designing the layout using a wireframe. Pencil and paper are surprisingly helpful during this phase, although many tools are online to aid as well.
Mock-ups based on requirements analysis
Designing mock-ups in Photoshop allows for relatively easy modification, it keeps the design elements organized in layers, and it primes you for slicing and coding when the time later on.
Review and approval cycle
A cycle of reviewing, tweaking and approving the mock-ups often takes place until (ideally) both client and contractor are satisfied with the design. This is the easiest time to make changes, not after the design has been coded.
Slice and code valid XHTML/CSS
It’s coding time. Slice the final Photoshop mock-up, and write the HTML and CSS code for the basic design. Interactive elements and jQuery come later: for now, just get the visuals together on screen, and be sure to validate all of the code before moving on.

Resource links for this phase:

Printable Sketch Templates for Wireframing
Color Scheme Designer
Type Tester, font comparison
iPlotz, online template and wireframing tool
Stripe Generator
Favicon Generator
Icon Finder
Stock Exchange, free stock photos

3. Development
Development involves the bulk of the programming work, as well as loading content (whether by your team or the client’s). Keep code organized and commented, and refer constantly to the planning details as the full website takes shape. Take a strategic approach, and avoid future hassles by constantly testing as you go.

Build development framework.
This is when unique requirements might force you to diverge from the process. If you’re using Ruby on Rails, an ASP/PHP framework or a content management system, now is the time to implement it and get the basic engine up and running. Doing this early ensures that the server can handle the installation and set-up smoothly.
Code templates for each page type.
A website usually has several pages (e.g. home, general content, blog post, form) that can be based on templates. Creating your own templates for this purpose is good practice.
Develop and test special features and interactivity.
Here’s where the fancy elements come into play. I like to take care of this before adding the static content because the website now provides a relatively clean and uncluttered workspace. Some developers like to get forms and validation up and running at this stage as well.
Fill with content.
Time for the boring part: loading all of the content provided by the client or writer. Although mundane, don’t misstep here, because even the simplest of pages demand tight typography and careful attention to detail.
Test and verify links and functionality.
This is a good time for a full website review. Using your file manager as a guide, walk through every single page you’ve created—everything from the home page to the submission confirmation page—and make sure everything is in working order and that you haven’t missed anything visually or functionally.

Resource links for this phase:

Wufoo, form generator
Adobe Browserlab, cross-browser analysis
Choosing the Right Web Platform

4. Launch
The purpose of the launch phase is to prepare the website for public viewing. This requires final polishing of design elements, deep testing of interactivity and features and, most of all, a consideration of the user experience. An important early step in this phase is to move the website, if need be, to its permanent Web server. Testing in the production environment is important because different servers can have different features and unexpected behavior (e.g. different database host addresses).

Polishing
Particularly if you’re not scrambling to meet the deadline, polishing a basically completed design can make a big difference. Here, you can identify parts of the website that could be improved in small ways. After all, you want to be as proud of this website as the client is.
Transfer to live server
This could mean transferring to a live Web server (although hopefully you’ve been testing in the production environment), “unhiding” the website or removing the “Under construction” page. Your last-minute review of the live website happens now. Be sure the client knows about this stage, and be sensitive to timing if the website is already popular.
Testing
Run the website through the final diagnostics using the available tools: code validators, broken-link checkers, website health checks, spell-checker and the like. You want to find any mistakes yourself rather than hearing complaints from the client or an end-user.
Final cross-browser check (IE, Firefox, Chrome, Safari, Opera, iPhone, BlackBerry)
Don’t forget to check the website in multiple browsers one last time. Just because code is valid, doesn’t mean it will sparkle with a crisp layout in IE 6.

Resource links for this phase:

W3C Validation (HTML, CSS)
Adobe Browserlab, cross-browser analysis

5. Post-Launch
Business re-enters the picture at this point as you take care of all the little tasks related to closing the project. Packaging source files, providing instructions for use and any required training occurs at this time. Always leave the client as succinctly informed as possible, and try to predict any questions they may have. Don’t leave the project with a closed door; communicate that you’re available for future maintenance and are committed to ongoing support. If maintenance charges haven’t already been shared, establish them now.

Hand off to client
Be sure the client is satisfied with the product and that all contractual obligations have been met (refer to the project charter). A closed project should leave both you and the client satisfied, with no burned bridges.
Provide documentation and source files
Provide documentation for the website, such as a soft-copy site map and details on the framework and languages used. This will prevent any surprises for the client later on, and it will also be useful should they ever work with another Web developer.
Project close, final documentation
Get the client to sign off on the last checks, provide your contact information for support, and officially close the project. Maintain a relationship with the client, though; checking in a month down the road to mak[…]

  


Productivity is a crucial asset of professional Web designers and developers. We regularly look for new resources, tools and services to make the search of these ever-growing techniques easier. Once we have a reasonable number of useful resources, we prepare them in a handy overview for your convenience. In this post we present some of the useful resources and tools for designers and Web developers.

Please don’t hesitate to comment to this post and let us know how exactly you use these tools in your workflow. Please do avoid link dropping and share your insights and your experience instead. A big thank you to all designers and developers out there for releasing and producing useful, valuable resources for all of us to use. We sincerely appreciate it.

Useful Resources and Websites
Method & CraftDescribing itself as “the DVD extras of design,” this site offers a behind-the-scenes look at different designs, including how they were achieved, the techniques used and how the designers have grown in their professional careers.

DesignersMXThis site is dedicated to finding out which tunes keep designers around the globe rolling and get their creative juices flowing. Just sign up, log in and share your own compilation of fresh beats and bright tunes.

Little Big DetailsThis site features tiny details that help improve the user experience of websites and mobile apps. You can also share your favorite little things on the website. The collection is very useful — with more design examples submitted regularly.

Shady CharactersThis blog, owned by Keith Houston, aims to shed light on the history of both well-known and outlandish marks of punctuation. It’s an interesting study in the stories behind the punctuation we use every day.

An Illustrated GuideThis project reviews some of the notable picture books. Guide’s authors, Catherine and Matthew Buchanan, have collected many of them from the last decade. The books are categorized according to cover art styles and reading level.

CV PARADEThis website celebrates the art of the résumé — a great collection of different and unique CVs that might be useful for you if you are about to polish your own CV.

Comic Sans CriminalThe next time you see someone using Comic Sans inappropriately, consider sharing with them a link to this site which lays out the reasons why Comic Sans is misused and offers some helpful alternatives.

Where Do You Want To Work Today?A simple way for freelancers, contractors and other nomadic workers to check out some great places where they can work in a different environment for a change.

Node CloudNodeCloud is a resource directory gathering sites related to Node.js and ordering them by their Alexa traffic, allowing to evaluate relative popularity of a project.

WeekendHackerThis site provides a mailing list you can issue a cry for help for one of those tiny projects that cross your path — whether you’re a designer, developer, or both.

The Phraseology ProjectHere you can submit a letter, word or phrase which is then turned into a beautiful design by the website’s founder, Drew Melton, or his colleagues.

Designers & BooksThis projects presents short reviews of books that esteemed members of the design community identify as personally important, meaningful, and formative. Designers introduce one or more books that have influenced their ideas and values. You’ll also find members who have created must-read lists for different disciplines in design.

QuotevadisQuotevadis is a Tumblog that offers quotes from creative and intelligent individuals from both past and present. An excellent replacement for the dusty old “about:blank” page in your browser.

Let’s SwapIn case you’ve had a particular artistic piece hanging around for a while, you could try swapping it with other artists for prints, books, zines, original artwork, tshirts, sculptures, or any other objects.

ideeeasThis project collects brainwaves from people who have brilliant, fancy ideas on any topic. There are posts with popular or useful social ideas that could make the world just a little better.

A Working LibraryA great book cover definitely makes for a graceful entrance, but the thought of it disappears as you start reading the book. This website aims to explore the ways we read — without being overtly conscious of the cover design.

The GodfounderA blog which showcases details that make Web apps successful, in particuliar little details that show designer’s attention to users’ needs.

FPO: For Print OnlyA blog dedicated to both visual stimulus and detailing of the development and production of printed matter such as annual reports, books, business cards, stationery suites, collateral materials, posters, packaging and anything else where ink meets substrate.

What Software and Hardware Do Professionals Use?A useful resource for people who love to keep discovering new tools. Browse these nerdy interviews and guaranteed, you will come across some new wonders, especially because every interviewee explains why they have chosen a particular tool.

Browser Details for Tech SupportWhen in doubt, send your customers to the website Support Details. Their data will be automatically read out of the browser and sent directly to you via email or will be saved. The free service uses Flash but can also complete its task without it.

The UX BookmarkA resource for HCI and human factors professionals, usability engineers, interaction designers as well as information architects. You can submit a link if you feel that it would benefit the UX Design Community.

Web Font Hosting Services ReviewedA good overview of web font hosting services you can always look up when in doubt:

Android PatternsDesign patterns, which are basically reusable solutions for recurring problems, can be found in many design niches. Recently, they’ve also turned up in user interface designs for Android apps. Android Patterns publishes a comprehensive set of interaction patterns that can help you design Android apps.

Useful Tools, Libraries, Plugins
Rapid Prototyping with flickrBombflickrBomb is a jQuery plugin that helps you quickly fill your prototypes with relevant content, and not just dull gray placeholder images when making a website.

Unix Terminal/Console/Curses ToolsA nice list of 28 tools for the UNIX Terminal and Console. Some are little-known, some are just too useful to miss, some are pure obscure. You can use your operating system’s package manager to install most of them.

.htaccess testerA very simple tool that lets you test your .htaccess rewrite rules. Simply fill in the URL that you’re applying the rules to, place the contents of your .htaccess on the larger input area and analyze if the rules are doing what they are supposed to do.

CSS LintCSS Lint is a useful tool to help you detect problems with your CSS code. It does basic syntax checking as well as applying a set of rules to the code that look for problematic patterns or signs of inefficiency. The rules are all pluggable, so you can easily write your own or omit ones you don’t want.

Log.ioHere is a way how to perform real-time log monitoring in your browser. Harvesters watch log files for changes, send new log messages to the server, which broadcasts to Web clients. You can then create stream and history screens to view and search log messages.

Popuload for Adobe PhotoshopRather than idly waiting for each processing task in Adobe Photoshop to finish, you can spend that time browsing the latest news feeds. Popuload has been programmed to detect when any Photoshop loading bar appears; it then appends to that loading bar window throughout the duration of the processing time.

Asciiflow: ASCII Flow Diagram ToolA simple Web based ASCII flow diagram drawing tool which allows you to draw boxes, lines, arrows and type and then export it straight to text or HTML.

Microjs: Micro-Frameworks and Micro-LibrariesMicrojs helps you discover the most compact-but-powerful microframeworks, and makes it easy for you to pick one that’ll work for you.

ShowoffDemonstrating your ongoing projects could be a huge pain. In general, your best option is to upload the files to a server somewhere. You could prepare a video or send over a huge package of files or just .zip it somewhere on project collaboration website. But what if you just want to quickly show someone a project you’re working on without sending over the large files? This tool aims to solve this problem. If you’re looking for an alternative, you might want to consider LocalTunnel.

MeldA visual diff and merge tool that lets you compare two or three files and edit them in place (diffs update dynamically). You can also compare two or three folders and launch file comparisons.

Convert Unix TimeA Unix timestamp (or epoch time) is the number of seconds that have elapsed since January 1, 1970 00:00 UTC. The mission of this site is to convert your timestamp into a human readable format and vice versa. You also might want to check out Epoch Converter.

DrushThis Drupal tool lets you install, download and uninstall modules and much more without even opening a Web browser.

BonesA WordPress development theme that was created after years of editing and reusing the same template to develop custom sites. A nice, well organized boilerplate for developers of WordPress themes or designers using WordPress in their projects.

FructoseFructose is a subset of Ruby that’s designed to be compiled into PHP 5.x. The generated code should run on any PHP version above 5.0. Most major Ruby features are supported, including operator overloading and blocks. Eventually, most of the Ruby standard library will be available to Fructose programs via libfructose.

loads.inBy simply entering the URL here, you can test how fast a webpage loads in a real browser from over 50 locations worldwide.

WriteMapsWriteMaps is a We[…]

Comments

By Paul Noble-Campbell


Requirements documents are highly polished but deeply flawed.




Crafting design strategies that result in truly compelling brand experiences, products, and services demands a change from traditional methods. It requires a more creative and iterative design approach that is optimized for identifying real human needs and addressing them with meaningful experiences.

read more

Comments

  


As a veteran designer, developer and project manager for more websites than I can count, I’ve identified a common problem with many Web projects: failure to plan. The same issues come up repeatedly in my work, so I’ve written this guide in order to help clients, other designers, businesses and organizations plan and realize successful websites.

This guide is written in relatively non-technical language and provides a broad overview of the process of developing a website, from the initial needs assessment through the launch, maintenance and follow-up. It is appropriate for:

Small and medium-sized businesses;
Organizations;
Institutions;
Web designers, developers, and design and development firms.

If you’re building a four-page website for your family reunion or a 5000-page website for a Fortune 500 company, then this guide might not be for you; it will either be too detailed or way too short, respectively.

Important questions and answers. Image by opensourceway
Why Plan?
Planning is essential for most businesses and organizations. In practice, many people fail to plan their websites. Sometimes the ever-busy, dynamic nature of running a business is to blame; there are so many operational demands that proper time is not allotted to projects. But this often happens because people fail to recognize that planning for the Web is just as important as planning for anything else in a business.

The (Lengthy) Deck Example
Consider the example of building a deck. If you want a deck for your house, you probably won’t call several carpenters and ask, “How much is a deck?” If you do, you’ll get the smart answer: “It depends.” In order to provide you with an estimate, a carpenter needs some details about the project:

What kind of wood? Cedar? Treated? Synthetic?
Where exactly will the deck go? Are there any obstacles to work around?
What height will it be, and how many levels will it have?
Do you want benches, railings, built-in planters?
Do you have clearance to bring special equipment into your yard?

Then there is the host of other things for the carpenter to consider: scheduling, building permits, inspection, maintenance, etc. That’s why a smart carpenter will answer your simple question with “it depends.”

Be sure to plan your way to success. Image by opensourceway
It makes sense to meet with more than one contractor to address the questions above and more. When you choose a carpenter, they should provide a detailed plan that you both sign. Throughout the building process, the carpenter should check in with you periodically and discuss potential challenges and snags.

Surely all of this makes sense, but consider another scenario wherein there is no clear plan:

“Hi, Jennifer Carpenter. It’s Juan Homeowner. I need a 20 × 30-foot cedar deck in my backyard. I want it built in two weeks.”

“Okay, Juan. I’ll pick up the materials and get started tomorrow. If you have any questions, just see me in your backyard while I’m working.”

Jennifer Carpenter gets started by drilling post holes for each corner of the deck. She assumes that Juan Homeowner has secured a building permit from city hall, because that’s how most of her previous jobs have worked out… But there’s no building permit.

As Ms. Carpenter starts framing the deck, she notices that Mr. Homeowner has put a large hose reel against his house and connected it to the faucet. Based on where the deck will sit, the hose reel will have to go. She’s not sure if he will want to move it somewhere else or have his outdoor faucet replumbed to reconnect it and put it on the deck, which is two feet off the ground. She stops building and waits to ask Mr. Homeowner when he gets home… But it turns out that he’s on a business trip for three days.

When he gets back, Ms. Carpenter reaches him by phone. He’s not happy that his faucet will have to be moved, because it adds unplanned expenses to the project. But that’s not Ms. Carpenter’s fault. She’s not the plumber. She’s just putting the deck where he asked.

Once the deck is framed, she starts building a railing for one side. This wasn’t discussed, but she sees that there are small children around the house and thinks this is a good safety measure. Mr. Homeowner comes home one day and is happy to see the great progress on his deck, but he notices the railing.

Mr. Homeowner: “What’s this?”

Ms. Carpenter: “I added a railing to the side because you have kids. It’s a good safety feature.”

Mr. Homeowner: “I don’t have small children.”

Ms. Carpenter: “But I saw them playing in your front yard.”

Mr. Homeowner: “Oh, those are the neighborhood kids. My kids are in high school.”

Ms. Carpenter: “Well, a railing is still a good feature.”

Mr. Homeowner: “Fine, but can you make it shorter and put a bench next to it?”

Ms. Carpenter: “I didn’t buy enough wood for a bench, and the railing is already drilled and attached. I’d have to remove and recut it. Also, we didn’t talk about a bench.”

Mr. Homeowner: “Well, I’d like a bench here.”

Ms. Carpenter: “That will take more time. I won’t be able to get this done by your two-week deadline if we add the bench. Plus, I’d have to charge you for the extra wood.”

What began as a simple project has become a series of headaches, all due to a failure to plan.

From a Web professional’s perspective, developing a 50-page website for six unique stakeholders is far more complex than building a rectangular deck. A deck is a physical structure built in stages. You can look out the window and see the progress. In contrast, a website has a number of technical and administrative steps that aren’t visible to all.

A Caveat, and the “Waterfall” Method of Development
When I worked at an insurance company, business analysts from the information technology (IT) department would write project charters: long, painfully boring documents that attempted to outline every possible aspect of a website. I hated these documents and preferred to work by the seat of my pants. My reasoning in part was that websites are flexible, unlike print material. That is, their content can be changed at will. The idea that every aspect of a website could be pre-planned on paper was ludicrous.

IT departments that handle large projects often use something called the “waterfall” method of development: specify absolutely everything, down to the point size of the type, the line length of page headers and exactly how a simple photo gallery will work.

See what is relevant and react. Image by opensourceway
This is my view of the waterfall method: if you’re building a banking application that transfers money in and out of customer accounts, you’d better be sure your code is perfect. When dealing with debits and credits, there is zero allowance for error. For projects this critical, it makes sense to specify everything you’re going to do in great detail before writing a single line of code.

However, as I said, websites are flexible. So how do we reconcile the need for clear and detailed specifications with the inherent flexibility of the medium?

We do this by splitting the difference. By following the process I’ve outlined below, we can create a set of content and design specifications that greatly reduce the likelihood of mid-project glitches, while creating a framework that allows the website to grow with time. In fact, we can plan for expansion by allowing, for example, a news section to handle 10 news items or 200. When these specifications are properly implemented in a content management system (CMS), the website will give its editors the flexibility to swap out key photos, change titles and headers, reorder content, etc.—all within the framework established by proper planning.

The Value of Planning and Needs Assessment
I am frequently approached by prospective clients who want estimates for building their websites. Sometimes they have a general idea of what they want and possibly a simple website map. Others, especially organizations, will submit a request for proposal (RFP). In most cases, none of this gives the designer or developer enough information to generate an accurate proposal. Even a multi-page RFP usually does not have enough detail from which to create a proposal and estimate. If a prospective client just wants a ballpark figure, I can usually do this, but much more information is needed in order to arrive at an accurate cost.

Ideally, prospective clients would hire either a designer, developer or project manager to do a thorough needs assessment before requesting a proposal. However, clients don’t necessarily understand the efficiencies gained by up-front assessment. Ten hours spent on a needs assessment can save 30 hours of development time. Discovering the needs of a client halfway through a project is a recipe for headaches, extended development time, cost overruns and missed deadlines. As you’ll read below, failing to recognize and pay for proper planning creates big problems.

Common Results of Failing to Plan

The designer or developer is forced to make assumptions, which may or may not be correct, about how certain content will appear on the website.
The amount of back-and-forth communication about trivial matters can be multiplied many times over.
Backtracking causes delays and missed deadlines.
Work that falls outside the original scope of the project creates cost overruns.
Confusion and client dissatisfaction are byproducts of a shoot-from-the-hip process.

Needs Assessment
Important things to remember:

Unless you’re building an intranet, the website is not for you and must meet the needs of your client.
A website is not an event. It is a flexible, extensible communications tool that reflects, negatively or positively, on the business.

Now we could potentially start using business-speak, as in “Assemble your key internal stakeholders.” […]

Comments

  


In this post we are glad to present to you yet another freebie: a responsive WordPress theme Yoko which was designed by talented designers Ellen and Manuel from Elmastudio and released for the Web design community. Of course, the theme is absolutely free to use in private as well as commercial projects.

Yoko is a modern and flexible WordPress theme. With the responsive layout based on CSS3 media queries, the theme adjusts to different screen sizes. The design is optimized for big desktop screens, tablets and small smartphone screens. To make your blog more individual, you can use the new post formats (like gallery, aside or quote), choose your own logo and header image, customize the background and link color.

Download the Theme for Free!
The theme is released under GPL. You can use it for all your projects for free and without any restrictions. Please link to this article if you want to spread the word. You may modify the theme as you wish.

live demo
large preview (.png, 1.5 Mb)
download the package (2.2Mb, .zip)
release on the developer’s site (with documentation in English and in German)
Documentation PDF file (in English)
Installation Video Tutorials

Features
The theme requires WordPress 3.1+ to run. It has following features:

Cross-browser compatible (tested in Chrome, Firefox, Safari, Internet Explorer 8+)
HTML5 (with fallback for IE < 9) and CSS3
Responsive layout (CSS3 media queries, not supported in IE < 9, but you can use libraries like Respond.js by Scott Jehl or CSS3-Mediaqueries-js by Wouter van der Graaf to make it work in older versions of IE.)
WordPress post formats (aside, gallery, image, video, link and quote)
Theme options page, custom background, custom header image
Optional sub menu
A custom social links widget to promote your RSS-Feed, Facebook, Twitter, Flickr, Vimeo, LinkedIn or Delicious profile
Full-width page template
Google Web fonts in use (Droid Sans and Droid Serif)
Threaded comments with Gravatar support
Shortcodes for multiple columns, info boxes in three colors and highlighted text
Currently available in English, German and French.

Screenshots
Three-Column-Layout.

Two-Column-Layout.

One-Column-Layout.

Comments area.

Custom Header.

Post Format Gallery.

Theme Options.

Behind the Design
As always, here are some insights from the designers:

“Since the mobile Web is getting more and more popular every day, we think that it’s also time for WordPress themes to become more flexible and adapt to different devices and screen sizes. While designing the Yoko theme, our goal was to create a minimalistic design with focus on content and good readability on various devices. Also we wanted the theme to be easy to use and customizable for everybody, so we kept the theme options simple while still including the most important options to add a personal style to the theme.

The main problem to solve during the design and development process was to make sure that all the different contents and plugins that people will use still work in the responsive layout. Of course the responsive design approach is still in development but we think it’s a lot of fun to explore new possibilities and as doing so make Web design and WordPress themes more powerful and flexible to use.”

Thank you, Ellen and Manuel! We sincerely appreciate your work and your good intentions!

© Smashing Editorial for Smashing Magazine, 2011. |
Permalink |
Post a comment |
Smashing Shop |
Smashing Network |
About Us

Post tags: Freebies, HTML5, WordPress