Since May, our research group has been developing a new tool called Snowball. As with our other tools, the purpose of Snowball is to empower people from all sorts of backgrounds to express and create — tell their stories — on the web.
We chose to implement Snowball as a WordPress plugin because WordPress users represent our target audience, and WordPress powers over 20% of the entire web, used everywhere from CNN and TechCrunch to the classroom.
Storytelling in the Digital Age
Stories take many forms, but we drew inspiration from articles like Snow Fall (if you couldn’t guess by the name). The work of the New York Times and a handful of other visionary organizations are exemplars of effective storytelling on the web. Three qualities set their work apart.
Snow Fall by John Branch — New York Times
Minimalist
Articles tend to be minimalist. This reflects a respect for both the audience and the content, and makes for a more immersive experience.
The Web We Have to Save by Hossein Derakhshan — Medium
Bespoke
Not only are distractions removed, but what remains purposefully enhances the content. The design is tailored to the content, advancing from the realm of grayscale newsprint to vivid magazine spreads.
Chunky in Fury by Mike Monteiro — Jason Santa Maria
Interactive
Perhaps most importantly, the content is interactive. One of the things that sets the web apart from mass media like newspapers and television is the interplay between creator and consumer. Online journalism is only now starting to tap into this potential by making articles interactive and social.
What is Code? by Paul Ford — Bloomberg
Snowball Effect
Unfortunately, most organizations don’t have the luxury of keeping world-class art departments and software development teams on staff. And most individuals, though they may have a story to tell, lack the technical skills required to craft these types of articles.
This is where Snowball comes in.
Although we’ve left plenty of headroom for people who know how to code or want to learn along the way, we’ve designed Snowball so that technical skills or a technical staff are not requirements. To make Snowball accessible to the beginner, we’ve adopted the following principles.
Chunking
Gone are the days where you can “View Source” on a webpage and make any sense of it. Likewise, it takes a lot more code nowadays just to start making something meaningful. No doubt one of the big leaps in the coming years will be componentization, paving the way for web development at a higher level of abstraction.
While we wait for the new standards to crystalize, we’ve taken our own approach in Snowball. First, we’ve decomposed modern web articles, identifying different chunks of content that are used to construct them. We’ve then given users a way to build up new articles using these content types, one block at a time. Snowball supports content ranging from pull quotes to interactive visualizations.
Looping
A tight feedback loop encourages playful experimentation and learning, so we’ve equipped Snowball with a live preview feature, which is something WordPress doesn’t offer by default. Tinker with a value and you can immediately see the rendered results. Not only that, but within the code view, you can inspect changes in the underlying HTML and CSS.
Scaffolding
While the overall structure of each block is determined by its type, users still need to give it their own touch. Snowball provides different degrees of support depending on the user’s abilities and goals.
Snowball offers a graphical interface that makes it easy to populate a block’s content and most pertinent styles. If you want to go beyond that, a code interface allows you to add your own tweaks with just a dash of CSS. And for the power users, an entirely custom block can be created with code.
Trying It Out
We’ve started our rollout, presenting Snowball last week at the ExCITe Center’s T3 event. With that said, Snowball is a research prototype at heart, and still a work in progress.
Next month, we’ll be hosting workshops in Philadelphia, where anyone interested in Snowball, from journalists and bloggers to students, will be invited to try it out and give their feedback.
In the fall, we plan to conduct more sustained pilot tests with partners, including news organizations and journalism courses.
If you’re interested in participating in either the workshops or pilot tests, drop me an email. And for more details about Snowball, check out the project site or the GitHub repository.
This is a wonderful move forward for WordPress, and specifically, a WordPress Plugin design and use.
WordPress really needs more modular and component-based user interfaces and design patterns like yours exposes here…. Pretty nice :).
Snowball for (WordPress) posts ? :-)
Snowball for (WordPress) pages ? :-(
Is that doable and would you mind ?
We considered supporting WP posts and pages, but made the decision to use a custom post type instead. One of the main reasons was that we wanted to be able to load custom stylesheets and scripts that Snowball articles may require, without affecting standard posts and pages.
There are definite advantages to embedding these blocks in standard posts though. If we support that in the future, it would probably be as a separate plugin.
I have a theme that displays posts on the front page as images w/ titles and I wanted to reserve that for poems but also have a blog where I would use Snowball for traditional Blog articles.
I tried to create a menu item “Blog” that would display posts by category and then set my Snowball article to that category, but it wouldn’t display the articles under that category, although it did display posts that I set to that category. This was a couple of months back and I’m too much of a noob to figure out what went wrong. See here: http://www.greenbriarroad.com/
Any suggestions?
Hi, I just realized that there is a support forum linked from the plugin page and that this issue has been resolved with the plugin update. I updated the plugin and now it works perfectly. Thank you! Great plugin!!
Glad the update fixed your issue. Please let us know if you come across any others!
Hi,
Are you planning to release update for the latest wp version? It says it might not be compatible.
Do you have any live demo of this?
Snowball has been tested with WordPress 4.5.3 and should work fine.
We don’t have a live demo set up at the moment.
Hi,
I’ve just installed Snowball and am trying it out and reading through the source to see how you’ve put it all together. Has a JS app feel to it which is interesting in a WP plugin. I like the way everything is quite separate from the WordPress theme. Using flexbox too for layout is good to see.
First issue I have is that the HTML and CSS textareas that live in div.snowball-code are read-only. So I can”t customise any elements. The line numbers in the text areas are over the top of the code so you can’t see the first couple of characters of each line.
So far the thing that is keeping me from using on a site I’m developing for an academic is the seemingly erratic nature of the width of various elements. It’d be good if there was a default width so if columns are added they are in total the same width as other text sections. Speaking of columns i wonder if you could set the columns with CSS as in: https://css-tricks.com/guide-responsive-friendly-css-columns/
Tried adding a sidenote but there was no margin around it so the following text ended up being hard against it. I don’t expect non-coders will dabble with the CSS so this one simple issue of the sidenote display just makes Snowball unusable unfortuntely because the page layout just looks dodgey.
Sometimes the page doesn’t display at all unless I remove an element by trial and error until the page reappears.
When some of the show-stopping issues are ironed out this will really be a great addition to WordPress.
Hi Paul,
Thanks for trying out Snowball and sharing your thoughts.
1. HTML is read-only for most of the modules to maintain their structure. If you want to create custom markup, you can edit the HTML section within the HTML module. The default CSS is read-only, but you can add additional CSS at the bottom (in the darker area) to override or customize styles further.
2. Line numbers should not be overlapping the code. Can you tell me what browser you’re on or open an issue on GitHub? https://github.com/thomaspark/snowball/
3. The width of different blocks should be fairly standard. For certain ones like image and text, they can vary but there should be an option to also make them the standard 600 pixel width.
4. Are you using your own WordPress theme or Snowball’s theme to present the article? If your own, can you let me know what theme it is? You can find the option to toggle between them by clicking the gear icon. Sidenote should work fine with the Snowball theme, but may have issues with third-party themes. We’ve tested with the most popular ones, but try to iron out compatibility issues with others as we encounter them.
I’ll also email my response to you in case you prefer to carry on the conversation that way.
Pingback: Polyfill for Scoped CSS | Thomas Park
Pingback: QuickLine: A Mac Utility for Saving and Launching Terminal Commands | Thomas Park
Hello
Snowball add new is created by the path of http://www.abc.com/snowball/001
Can not delete / snowball / subfolder?
I recommend Simple Post Type Permalinks plugin to customize this path.
Beautiful and useful plugin. Thank you for sharing.
Have a look for Story Blog Template also good plugin.
Great plugin- thanks for making this!
Any way I can prevent a snowball post from being automatically classified as a page? My WordPress theme (MH Magazine) obligatorily treats them as pages and lists them on a header with other pages – I’d like to have the snowball posts in a menu along with other types.
Hey Charles, thanks for stopping by. It sounds like your WP is set to auto-add pages/custom post types to a menu.
Try going into Appearance > Menus > Select a menu to edit > Menu settings. Then uncheck “Automatically add new top-level pages to this menu” option. You should then be able to manually manage which page and Snowball articles get put into which menus.
It’s a fantastic plugin! i’ve been looking for something like that for ages and this one integrates well with the existing theme, is easy to adjust and works fast! And in addition to that – it’s just awesome :)
The only thing that is missing – can we somehow edit the slug so it doesn’t append “snowball” to the url?
Thanks!
(Fyi: You probably won’t understand the content, but just wanted to share the very first post created using snowball: https://cieplikpodrozuje.pl/snowball/motocyklowa-podroz-grupy-wyszehradzkiej/)
Thanks for the kind words. Your site is quite beautiful and is just the use case we were hoping for when we set out to make it!
For changing the /snowball/ slug in the url, you can use a separate plugin called Simple Post Type Permalinks.
Hi Thomas,
I really like Snowball, and I hope to use it for our new WP site. One problem has arisen–when I create an article in Snowball, I can’t classify it under any of our existing categories.
Do you know a fix for this?
thx
Francis
Hi Francis, do the Category and Tags meta boxes show up when you’re editing an Snowball article or are they not visible at all?
Hi Thomas,
They do show up, but the only ones that show up are the categories we create for Snowball. We can’t view any of our native article categories. Fyi, we are not publishing under the “posts” tool, but rather publish under articles.
That’s odd, could you try deactivating all other plugins besides Snowball and see if they remedies it?
By the way, do you mean you’re trying under the Snowball > All Articles menu instead of the Posts > All Posts? Categories should still be shared across the two.
Is the snowball plugin dead? No update in 5 months, reported a major problem / bug via email to you / openhtml no reply. and the park @ drexel account is told to be no longer existing. Anyway, here my problem, hope any soul will reply to it and supply a fix for it soon:
Categories broken for the extra theme (by Elegant Themes derived by Divi) since Snowball is installed the Stories category that I have put to be assigned by snowball posts works as expected, however, all the other posts are defaced when I click on those non-snowball categories.
Please release a fix for this as we need the separated Snowball posts
you can see it with your own eyes: http://www.c64.tv
thanks in advance!
Sincerely,
Joerg Droege
Hi, I am aalready running a WP blog with a theme for m posts. Is it ok to add snowball to this blog? Or does it mix up with the existing articles? Is it a better idea to supply snowball with an newly installed WP system? Thanks for your help!
regards,
Suitbert
It’s fine to add Snowball to an existing blog. It doesn’t modify already existing posts — it creates a new custom post type that coexists with posts on the front page, search, archives, etc.
Hello Thomas,
Are there online workshops for tips and tricks to using snowball? We use it quite a bit at my company, but are still looking for ways to streamline the process and make it more efficient. Let me know if tutorials exist. Thanks!
Hi Megan, we don’t offer any online workshops, but if you have any questions, don’t hesitate to send me an email!