Required Reading for Product Managers

Information is valuable and this is a great link to checkout. http://robertlenne.com/requiredreading/

Building a better blogging platform

Note: I wrote this answer on Quora a while back.

I love writing and there are a ton of things that can be done to change and improve the state of blogging platforms drastically.

Here are some that I feel are important:

• A standardized format for individual entries across all/most blogging platform. For most geeks this is Markdown. With the advent of Dropbox and other Cloud services something as simple as a .txt file could become that format.

• A simpler way to write: It is funny that most of today’s blogging platform’s text editor is more powerful than some word processors. It needs to be simplified. I really like what https://svbtle.com/ by Dustin Curtis is trying and many of the ideas behind it.

• Mobile version: No, I do am not expecting someone to write 500 word articles on mobile (tablets excluded) but it should be able to jot down thoughts or just snap a picture and post it.

• Make it easy to “embed” my social content: I would prefer this to be inherently built in the app in a fashion similar to Storify so that I can quickly choose a picture I just uploaded to Instagram and make it the latest post on my blog. Or an answer I just wrote on Quora?

• Showing other relevant content from the blogosphere: If I am reading or writing a blog about a topic, why can the blogging platform not show me what my friends have written about it OR make it easy to do prior research.

• Democratize Art Direction: Till now art directed or uniquely styled entries for each post have been done by designers mostly. Why can this not be made universal? Jux does this at a basic level for content writers but this really should be more simple. It should essentially be drag and drop.

• Social: The whole social angle in today’s blogging systems is “start from scratch”. But why not make it easy or maybe just possible to include users/things/references in posts. Kind of like Quora.

• Search: For most blogging platform the search is broken. Make it better?

• Comments: I do not wish to open a can of worms but the comments on the web are broken. This is the biggest reason I do not have comments on my own site, even if I am losing on a ton of meaningful conversation.

• Central CMS for Enterprise: While not a current problem but you could think of a dashboard for small companies to maintain their Twitter/Facebook and Blog. While this is not directly related to the question, but if you think of twitter and facebook timeline as evolved form of communication in post blogging world, then it makes sense.

• Analytics: It is kind of funny how analytics have not yet become a part of blog engines. Why do I need to add a script from Google Analytics. I understand the part about focus but it is still complicated for non geek users. Also if this were a part of blogging engine, it would be far more powerful IMHO. Example, people reading. People who quoted the article or a part of it. Mentions on Twitter etc.

• Discovery: Writing a blog post is one part, but can the blogging platform make it easier for others to discover what you wrote, without the constant expectation of writing more?

• The CMS and the Blog should be one: You should feel as if you are writing ON YOUR SITE, for only then can your words do true justice to how people will read/experience the content. Here is a first draft of what I plan to make my blog’s CMS as. I am sure you can simplify it further with more javascript magic. For now I still have to add custom CSS links and tags to apply non default stylings to blog posts but this should be simpler.

• Maybe find a niche for longform content: While not a CMS’ fault, the world can do with more longform bloggers. So maybe the blog can help in that. Say allow for rumination of ideas or celebrate longform with the theme and templates that it comes with.

• Better Typography: How about smart quotes, en and em dashes and a bunch of other smaller stuff like paragraph indentation, rhythm of typography. An average person should not have to worry about this when writing. It should just work

These are some I can think of right now. I will keep adding more as I think of them.

Source

Interface Inventory

Many are familiar with the concept of a content inventory. Content audits are usually performed in the early stages of a website redesign process to take stock of all a site’s content. It’s a tedious process involving spreadsheets and caffeine, but the hard work pays off. You end up all your content laid out on the table, which gives you a new perspective on what your content is and how to tackle it.

Enter the interface inventory.

An interface inventory is similar to a content inventory, only instead of sifting through and categorizing content, you’re taking stock and categorizing the components making up your website, app, intranet, hoobadyboop, or whatever (it doesn’t matter). An interface inventory is a comprehensive collection of thebits and pieces that make up your interface.

Conducting an Interface Audit

Here are the steps to creating an interface inventory:

1. Crack open your project. Get your screenshot fingers ready.
2. Set up a blank template where you’ll dump and categorize the components of the interface. I’d recommend using a program like Keynote or PowerPoint, as you really just need a category title and a place to dump screenshots. I’ve created an interface inventory Keynote template with a bunch of categories to get you started.
3. Start screenshotting. Now for the fun/tedious part. Start grabbing screenshots of the ingredients of your interface. Grab headings, text fields, radio buttons, carousels, accordions, tabs, images, icons, video players, graphs, etc, etc. Note that you’re not trying to capture every single instance of a component, but rather uncover distinct treatments of a component (like a button with a bevel and right-facing caret vs another without any bevel/caret).
4. Categorize screenshots. You can do this as you go or after your screenshotting session, but the goal is to be able to view all the various treatments of a particular molecule side by side.
5. Present the interface inventory to your boss/client/organization and watch themcry realistic tears.

Benefits of an Interface Inventory

Why go through all the trouble of deconstructing and cataloging an interface? It’s certainly a tedious process, but the results are extremely beneficial. Here are just some of the benefits of an interface inventory:

• Lays the groundwork to a sound design stystem—Creating systematic, atomic,styleguide-driven design is a smart strategy, and an interface inventory is that first step at deconstructing pages down to their atomic level. Eventually the interface inventory can be used to help set up a style guide or pattern library.
• Convince your boss/client/organization that establishing a cohesive design system is essential. This is especially true for large organizations consisting of many teams or working with multiple 3rd party agencies. An interface inventory is the first step toward establishing a common interface language.
• Promote consistency—Displaying a plethora of similar-but-still-different treatments next to each other exposes redundancy and underscores the need to create a consistent, cohesive experience.
• Ensures all interface components are accounted for—This happens a lot. A full-on redesign is underway, and somewhere along the line certain modules end up slipping between the cracks. Creating an interface inventory up front helps establish project scope and ensures that all components are accounted for so there are no nasty surprises at the 11th hour before launch.
• Responsive Retrofitting—While mobile-first responsive design is certainly a preferred approach to responsive design, it’s not always feasible to undertake right away. Budget, time, scope, skillset, and more often force organizations toretrofit their existing website into a responsive site. Creating an interface inventory allows design teams to analyze the interface in order to establish what components will be easy and relatively difficult to convert into a responsive environment.

Interface Inventories In Action

I went through just a few pages of my bank’s website and screen grabbed all the various button variations I could find. Here’s the result:

As you can see, their button styles are all over the place and are about the furthest thing from consistent and cohesive. Looking closer at the buttons reveal incredible inconsistency in gradient, arrow, border and more:

Now contrast these styles with a button interface inventory for Etsy, a company who maintains a robust styleguide and pattern library:

As you can see, there are far fewer button styles. This is a good thing as it means that there are only a few button styles that get reused throughout the interface.

It’s not to say that deviating from established patterns is always a bad idea, but it’s important to recognize the difference between intentional and unintentional deviation. An interface inventory helps expose unintentional inconsistencies and encourages consistent, deliberate design decisions.

The Road Ahead

More organizations are beginning to understand the need to create robust design systems, and interface inventories can be a great way to display an interface as a system of components rather than a series of discrete pages. An interface inventory can be a great way to convince your client/boss/organization to undertake a thoughtful, systematic redesign.

Download the interface inventory Keynote boilerplate and get screenshotting!

Source

Nike Selfridges. 8 Interactive Nike Windows for Selfridges (London, during Olympics) Nike Brand Design EMEA. Source

Ad changing based on the height it is viewed. Kids see one ad while adults see another. Anar Foundation against child abuse needs funds urgently.  Source

Best Bus Stop Ever. We wanted to make everyday life better with mobile, so we brought in a few surprises to a bus stop. We put up a poster featuring a URL. We waited for people to visit the mobile site. When they pressed the button, the fun began.  Source

Reinventing Payphones - NYC I/O: The Responsive City. The City of NY asked the tech and design community to reinvent NYC payphones to make our city more accessible, safer, and better informed. In response, Control Group and Titan partnered to create NYC I/O— the transformation of the corner payphone into a digital node that will usher in a new era of The Responsive City. Source

New Layouts for the Multi-Device Web. Most Web page layouts rely on design patterns created for laptop and desktop computers equipped with a mouse and keyboard. As the variety of devices being used to access the Web has grown, these patterns haven’t been keeping up. Designing for today’s Web means considering single-handed thumb use on smartphones, two handed touch interactions on tablets, mouse and keyboard input on traditional PCs, hybrid devices, and more. Web layouts have to evolve to support this new reality. Source