Notes

News, links, research, and product announcements from XOXCO in Austin, TX.

  1. Posts tagged design

  2. Weeknote for July 11, 2014

    We celebrated a very specific anniversary this week:

    A lot of the team has been traveling (or having a baby!!!) over the past couple of weeks but almost everyone is back now. We’ve been pushing like crazy on “El Grande Burrito” and we’re now THREE WEEKS out from finishing the project.

    We welcomed our newest team member, Paulette, this week. She’s going to be project managing, kicking ass, and keeping everyone on track.

    Our node-slack module - a nodejs module for sending and receiving messages from Slack -  got an update! Check out Ben’s work on that here. Thanks to Ben’s module, Slack sent our team socks!

    Eric was a writing machine this week. He wrote a great article on the differences between a product and project manager. He spoke at Refresh Austin on the same topic, and submitted a panel idea for SXSW 2015. (There are only two weeks left to submit ideas!)  And in between all of that, he’s been transitioning our clients over to the newest version of Packagr.

    Bushra made a thing in Cinema 4D. Suggestions on what she should turn it into? My vote is a showtunes-singing grilled cheese.

    AngularJS wowed the team again this week with its form validation tools. Like many other things that Angular just does for us, its form validation tools are built-in and active by default, and provide most of the functionality we need. So by using Angular, we get sensible, useful form validation that not only works but provides a clear path to future functionality that’ll be coming to browsers in the near future.

    Link Roundup

    If you didn’t see Eric’s post earlier this week on the team building a pixel derby taco truck, you should see the pictures!

    For Packagr enthusiasts, check out this article on using the Craft CMS Matrix to design custom fields for longform content.

     

    posted 1 month ago on Jul 11, 2014 | Permalink | 6 notes

  3. Weeknotes: 6/23/14

    We’re hiring! We’re looking for a freelance JavaScript and/or PHP developer to join our team in Austin, TX. Contact us if you’re interested.

    Ben spent ten hours in meetings this week with our client working on “The Grande Burrito” project. As we’re nearing the big launch, we’re seeing that the work for this final push to get it launched is just as difficult as all of the work leading up to it.

    Other big news: the upcoming version of Packagr will allow you to “browser wank” your project all you want! Previously, we’ve been focused on the actual device previews so you could see what your project would look like on an iPad, a laptop, a phone, etc. Ben created an option that makes the content preview more like a traditional word processor so you can resize your window to whatever size you want.

    image

    Bushra has been fine-tuning the new Packagr UI and she and Eric have been working on theme creation. They’ve looked at real-world examples of publications we like and found what makes those styles readable and aesthetically pleasing. One that we all agree is great is the Harvard Law Review. Their aesthetic is beautiful and clean, and clearly meant for reading.

    Eric met with Joel Goodman from Bravery Media to talk higher ed. Joel has been working in the higher ed tech space for several years and shared his insight of the industry. We see some great applications for Packagr in the higher ed space and are preparing to demo Packagr at some conferences later this year.

    Link Roundup

    Lots of stuff to share this week!

    The Great Discontent has a new look that we’re big fans of: http://thegreatdiscontent.com/

    Along with the latest art issue of Dark Rye we posted last week, check out Google’s new Street Art project with art from around the world: http://streetart.withgoogle.com/

    They also created Made with Code with some great intro projects for kids getting into code. Check THIS out to get your mind blown.  

    Our friend Trent Walton shared his experience on building the mobile Rolling Stone site: http://d.pr/v/kI99

    The NYTimes shared some tidbits about their CMS tool, SCOOP.  

    And finally, a couple of #longreads that are totally worth diving into. A beautiful article on how designing for the ideal solution worked at Bell Labs in the 1950s and an epic post on the new “coding literacy” can be found here.

    posted 2 months ago on Jun 25, 2014 | Permalink

  4. Weeknotes: 6/13/14

    This week has been insanely busy here at the XOXCO office!

    Damien has been refactoring our Packagr app using AngularJS. This is really neat because it allows an entirely new way to write modern javascript applications that gets rid of redundant code and opens the door to more features for the end user. Main point? Better features, faster.

    On that note, we’re at the tail end of a development sprint with the latest version of Packagr! I got to play around with the updated UI and the new editor, and it’s so simple to use. Bushra has been working on establishing that UI by problem solving in some really interesting ways. For example, she asked herself this week if she could walk someone through using Packagr by verbal instructions alone. She also played around using iconography vs. text for visual cues and testing which works better.

    image

    Eric also got to play around with the new UI and editor, and used it to validate our approach by re-creating some Vice articles. Using Packagr’s RSS feed importing feature, and matching the styling through CSS, he was able to recreate the existing look and feel in our more flexible format.

    The team’s other big effort this week has been on a “the Grande Burrito,” a big, ongoing client project.

    With a dozen pages, each with multiple screen sizes, there are now hundreds of comps to show. Bushra has developed a good organizational system using Sketch and InVision to present at design reviews, and leave behind with the client.

    The client wants a way to make their web experience tell a story that their customer relates to, so Bushra has been thinking about that strategy as well. That narrative can really determine a customer’s perception of a business, the quality of their experience, and whether or not they buy.

    "You can only use so many pictures to tell the story," said Bushra "I’ve been trying to use the other tools I have to make the voice of the company personable on the web."

    Link Roundup

    Our friend Dave Rupert was kind enough to give a Packagr shout out on the latest episode of his Shoptalk Podcast. Thanks, Dave! Be sure to check out next week’s episode, which features our good friend Sam Kapila.

    In other news, the second piece of the ART issue of Dark Rye is out! Check it out here, and or get this and all issues in the Packagr-powered iPad app!

    image

    There’s also a really great design prep class that Bushra’s sister, Sidra Mahmood, put together. The resources in it are excellent: http://bitmakerlabs.com/design/prepwork/

    posted 2 months ago on Jun 20, 2014 | Permalink

  5. This week, we helped our friends at Helsinki Design Lab launch an archive of the all of the materials they created during their five-year run. The archive includes some beautifully designed and extremely information dense books, a series of posters, videos and 130,000 words documenting the day to day operations of the lab.

    HDL’s goal was to promote the idea of strategic design, or the application of design processes to big picture problems like health care, sustainable development, and climate change.

    This archive represents a very valuable collection of material for designers and large organizations who want to work with designers to solve big problems.

    Start exploring the HDL archives here.

    (XOXCO worked with HDL and Rumors Studio to design and develop the HDL site using our PeoplePods framework. More information about the original project can be found here.)

    posted 1 year ago on Jul 5, 2013 | Permalink | 4 notes

  6. Links for 6/11

    Brad Frost, responsive web guru and genuinely nice guy, wrote about the concept of atomic design - designing web pages from the smallest component up, combining atoms into molecules into organisms which populate a finished page. Along with style guides and pattern libraries, this represents the shape of modern web design.

    At least for today.

    Cleve Gibbon has written a great explanation of why we should be building content APIs, not more web publishing tools. If anyone asks you to build them a new CMS plugin or website template, send them this link first! Then, send them to Packagr. (Hat tip to Jeff Eaton for the link.)

    posted 1 year ago on Jun 11, 2013 | Permalink | 1 note

  7. Publishers Should Publish, Not Chase Technological Trends

    In the complex decisions between responsive HTML5 websites and native mobile applications, publishers shouldn’t take sides.

    The insight of content management systems (going back decades ago to document processing systems and technologies like SGML) was to separate content from presentation.

    Somewhere along the line many tools got confused and separated web content from web presentation details.

    This is wrong.

    Our systems need to make multi-platform publishing — whether it’s to a native iOS application with Newsstand integration, a weekly email newsletter, or whatever best serves the reader — as simple as publishing to the web.

    Currently this type of publishing is something between frustrating and impossible even the best tools, and those tools aren’t widely available yet.

    Talk about a “tablet-native” journalism misses the point — of course tablets open up new possibilities in reading. Of course we should create beautiful experiences for the iPad. Of course we should curate our best content for our Newsstand app.

    That doesn’t mean we should build brand new systems that do nothing but publish iPad apps.

    Multiplicative Solution

    We need to address new formats in a multiplicative way — not an additive way.

    Each new platform — and there will always be new platforms — can not be a new $100,000 one-off project with new techniques, tools, training and staffing requirements.

    We should not be creating a new custom solution for every new platform that launches.

    Organizations need to plan and build for a multi-platform future because that is where the audiences will be in 2015 and 2025.

    Chasing iPad readers, for example, misses how powerful something as simple as email newsletters still is. Responsive web sites help smartphone users, but aren’t the solution for Kindle and Nook users who are best served with an ebook.

    Audiences on post-web platforms want different things than the click-hungry blog readers refreshing pages on their work desktop computers. Our tools need to adapt.

    HTML5 Is Part of the Answer

    Many people, ourselves included, have long held that HTML is and will be the best solution to these problems. But we’re finding again and again it’s not the whole solution.

    While HTML in many ways is this lingua franca, enabling a reasonable presentation layer across devices, simple web pages built with HTML are not necessarily the best experience for all readers of a publication that is more than just a page.

    Publications are about more than just articles — newspapers, magazines, books are packages of content.

    Packages are more than just content: they are full experiences that include curated content, presentation, and navigation. They had a beginning, middle and end. These are present in the physical packages we use to transmit content. What parts of this experience can we translate into the digital?

    Complex web pages — what we now call HTML5 web applications — that use the latest CSS3 tricks and Javascript are simply not sufficient to deliver a background-downloaded NewsStand application on an iPad so a reader awakens to a beautiful new cover every morning.

    Even in 2013, beautiful publications with responsive gesture controls, instantaneous page switches, smooth inertial scrolling are not always best delivered in an HTML page. Trust me, we’ve been trying.

    HTML may be a great way to represent documents in a cross platform way, but that doesn’t mean we build the tools to read them, like web browsers, in HTML and Javascript.

    This doesn’t mean we throw out HTML, or that it’s outdated, just that that it’s only part of the answer.

    Our Solution

    What we propose is to shift the focus up a level.

    Publishing platforms that create these expertly crafted experiences beyond simple web pages — even when they vary by platform — are the next step in the evolution of content management systems. In the same way that our content management system adapted to create RSS feeds, now they must grow to create iPad applications, ePub files, and a myriad of other tools that make reading easier.

    XOXCO

    XOXCO is building a tool that will enable publishers to create these multi-channel, multi-platform digital experiences. We are now actively looking for forward thinking content producers and publishers to work with. Can we help you? Get in touch.

    posted 1 year ago on Jan 22, 2013 | Permalink | 7 notes

  8. Stop Making Websites

    When the term “blog” was coined sometime towards the end of the last century, one of the most difficult problems we faced as an industry was simply how to get more content and more people onto the web. We solved this problem by creating easy to use, web-based content management systems like Blogger and Wordpress to help normal people get their words and pictures onto the web.

    This enabled a whole generation of creative people to share their work online. Web magazines, daily opinion sites and independent news sites flourished in this exciting new environment that was hungry for exciting new content. None of these sites, however, made much money.

    In 2005, long after the blog had established itself as the dominant form of web publication, the big problem became how to sustain digital publishing as a business. The solution most of us set our sights on on was to generate massive amounts of traffic so that we could sell ads based on our page views.

    Sites like those in the Gawker network optimized for page views by increasing the frequency of publishing. Whereas blogs pre-Gawker might post a few posts a day, post-Gawker, the norm for a digital publisher became to publish as many posts per day as possible.

    Meanwhile, companies like Huffington Post and companies like Demand Media pioneered the technique of crafting content specifically to lure in search engine traffic - posts written to match trending search topics, so that users would click through primarily to be served an advertisement.

    Much to the chagrin of people like me who had been publishing online since the dawn of the web, these new formats and techniques have been pretty successful.  As a result, virtually every digital publication launched since then has focused on these goals: publish as fast as possible to optimize desktop web page views and rake in ad and search revenue. The tools used to create these sites, like Wordpress and Drupal, were also optimized to create this type of publication - it is now the defacto standard for websites and content management systems to be organized as a blog, storing and serving content for immediate consumption on the web.

    This type of publishing values an ephemeral, passing relationship with the reader — the faster they can be sent on to the next thing, the better. The long term relationship, the loyal readers, the paid subscribers don’t matter nearly as much as someone whose search query lead them to a page hosting the right ad unit.

    This year, Wordpress turns 10. Movable Type and Drupal are now 12 years old. In the years since their introduction, we’ve gone from a world populated by dial-up connected desktop PCs to a world in which Apple will be updating the iPad and iPhone twice yearly, and where there are so many flavors of Android device that you need a fancy infographic to explain them.  We have e-readers and smart watches and tiny printers that beg for new content. Google, Amazon and Apple have set up huge stores just to sell your content to their millions of customers.

    Meanwhile, the market for CPM based ad sales and display advertising is suffering like never before. Publishers and marketers now want engagement, integration into content, and to build a direct and lasting relationship with their customers. Page views alone are no longer enough.

    Where does this leave publishers who have invested in web publishing / blogging ecosystem? If our experience working with clients on responsive redesigns and reader aware functionality lead us to any conclusions, it is that these blogging tools are woefully inadequate and out of date in the face of the contemporary marketplace for content. Saddled with complex and customized content management systems, these organizations have a hard time adjusting to the new face of digital publishing, which is much less focused on page views and much more focused on building lasting, loyal relationships with readers.

    It reminds us here at XOXCO a lot of those early days of the web — an exciting new environment, filled with customers hungry for exciting new content.

    Our publishing tools need to catch up. The web is no longer a medium dominated by desktop PCs sitting on desks, and the world of digital content consumers can no longer be defined as people who read blogs while sitting at work. The tools we use to create these products must evolve to allow us to deliver, present, and repurpose our content to take advantage of these new opportunities.

    Does this mean abandoning our investments in Drupal and Wordpress? Of course not! In fact, we think these web CMS systems do a great job at managing content. Where they’ve fallen behind is in producing the kind of premium, reader-friendly end product we need today to stock the virtual shelves of the app stores and ebook stores.

    Our proposition: stop making websites, start making native digital products designed for and delivered to the entire spectrum of devices.

    XOXCO is building a tool that will enable publishers to create these multi-channel, multi-platform digital experiences. We are now actively looking for forward thinking content producers and publishers to work with. Can we help you? Get in touch.

    posted 1 year ago on Jan 17, 2013 | Permalink | 10 notes

  9. Aware.js: Now Lunch Aware

    The core idea of reader aware design is that interactive experiences can and should respond to the specific characteristics of a user and their context. Previously, we discussed using details of a user’s relationship with a site — are they a first time visitor, or an every day regular? Now, we move beyond the site, breaking away from a user’s digital context to their analog, real life context: is this person at home? At work? In bed? At lunch? How can your site best serve readers in these different environments?

    To enable this kind of design, we’ve updated our reader aware design tool, Aware.js, to provide information about the reader’s local time of day. See a simple demo, or download the code from Github.

    Aware.js will now add CSS classes like “morning,” “earlyevening” and “latenight” to a site, empowering designers and developers to create variations in the design and content that relate to the natural cycle of the day. Tapping into these hints about the reader’s context outside of the computer screen will help to improve the visitor’s experience, and offers new opportunities to publishers who want to experiment with packaging and presenting their content for different use cases.

    With this new functionality, Aware.js enables features like:

    • Create subtle changes to the mood of the site that relate to the time of day - for example, changing the background color or header of the site to match the color of the sky outside.
    • Adjust the brightness or contrast of pages late at night, when users are likely to be reading in darker rooms.
    • Reflow content to create an “evening edition” of your site, highlighting the most important stories of the day.
    • Using Aware’s Javascript reader object, this information can be tied deeply into any web application, personalizing the app’s functionality or interface to be better tuned to the environment around it.

    Learn more about reader aware design, and get in touch with us to discuss how we can help your publication or application take advantage of these new techniques.

    posted 1 year ago on Jan 16, 2013 | Permalink | 4 notes

  10. Although it’s not complex technically to adjust presentation or content based on time of day, I don’t see it that often, and it’s still a wonderful little surprise.

    There’s something very humanizing about technology that adapts to the time of day in an ambient way.

    Because machines by default don’t care! But we do, as people. Real world environments change throughout the day. If they don’t, there’s an uncomfortable artifice to the place, like a Las Vegas casino.

    Most software has this uncomfortable artifice, devoid of the natural cycles of the sun that help contextualize our lives.

    Painted Ceilings in Software · trenchant.org daily

    Adam discusses the use of time of day as a factor in your application and content design. In addition to doing clever things like changing the background color to match the sky, what kind of interesting things might we do with this information?

    • Could your site have an evening edition? How about the late night edition?
    • Do readers use your site during work hours the same way they use it before and after work?

    The natural cycle of the sun is a real part of how and what we do throughout the day. Using this information to assist your readers and users may help to make your site more intuitive and pleasant to use.

    Inspired by this post, we will be adding a time-of-day component to Aware.js soon!

    posted 1 year ago on Jan 15, 2013 | Permalink | 2 notes

  11. 2012 Recap

    2012 was an enormously productive and successful year for XOXCO. Though we can’t discuss the details of the majority of our projects, here are some of the highlights:

    In January 2012, the brand new, responsive design that we built for The Grammy Awards launched. We worked with our friends at Lullabot on this project - they handled all the backend development, while we built a completely custom responsive Drupal theme from the ground up. See Grammys.com.

    Also in January, a new responsive design for Safari Books Online hit the web. We worked with Lullabot on this project too! See SafariBooksOnline.com.

    In March, April, May, June and July, the XOXCO team worked with REDACTED to create a Drupal-powered API server, and an HTML5 Chrome application client which used the Ember.js framework. You can read a bit about our experience with Ember here.

    In August and September, we worked again with Lullabot to create an HTML5 framework that powers 30 high profile mobile websites for REDACTED. Boy, do we wish we could talk about this one! We built a framework that allows each of these 30 sites to pull in their own set of data from a variety of structured data APIs, several of them providing real-time data, and to present all of this information in an app-like mobile website that can have its look and feel customized via a Drupal interface. Fancy!

    In October and November, we built an HTML5 magazine for REDACTED. The magazine is powered by a Drupal API on the backend, and a completely custom HTML5 client on the front end. The work we did on this magazine continued our exploration of using Drupal as an API server only, keeping all of the layout and content presentation in the HTML5 app.

    Finally, in November we launched a redesigned and rebuilt Pando Daily, and introduced the world to the idea of reader aware design - the idea that websites can and should look back at their readers. We followed this up with the release of Aware.js, a tool that lets any site become reader aware.

    Some broad lessons we learned in 2012:

    • The only job your CMS should do is manage content. Stop building PHP theme files and custom CMS plugin hacks to build your website, and let the CMS simply serve up content to a separate layout engine.
    • Responsive web sites are great, but technology is moving so fast, and device release schedules are so tight that even the fanciest media queries cannot keep up. Clients do not care about browser makers and OS versions - they simply want their content to arrive in perfect condition. Stop building web sites, and start building platform agnostic content delivery tools.
    • Responsive moves in both directions - much smaller screens AND much larger screens. We had two clients who wanted their sites to adapt from 300px wide all the way to 1800px wide.
    • Reverse chronological streams of content (that is, the blog format) don’t work as well as they used to. Readers demand personalized, curated and direct access to the content they care about - and that might mean serving them up something that is NOT the newest post.

    We are looking forward to new adventures in 2013. XOXCO will continue to work on new reader aware design tools and techniques, and we’ll be engaging directly with publishers to help them go beyond the limitations of their content management systems and traditional web publishing platforms to create exciting new digital experiences. Keep an eye on our blog for more!

    posted 1 year ago on Jan 2, 2013 | Permalink | 8 notes

  12. Next »

Receive XOXCO's curated broadcast of original essays and links about product design, publishing, and software. Featuring exclusive links to experimental software and limited edition digital downloads.