Digital Hoarding - Community Comments

I help run a UX community on Slack. We have ~5000 members but make use of the free tier. This means that the community has a 10,000 message limit in place, once we reached that 10,000 anything new added pushes out one of the older posts.

Useful comments, useful links, jokes, insights, detailed explainations and in-depth analysis all lost like

Tears in the rain

The other Admins and I had a few discussions on this, how were we to keep this useful info, how could we capture it before Slack removed it and add it somewhere useful. We talked of archiving systems, Pinterest, moving to another system without the message limitations.

But then, in the course of these discussions, we had a thought—perhaps we don’t need to keep everything. Digital moves fast, what was gospel 6 months ago can be discredited in an instant so that

Nobody does it that way anymore.

What do we achieve by keeping a record of these old links? With ~5000 UX professionals as part of the community we have an ideal up-to-date crowdsourcing system. People do ask the same questions as they can’t always see what has been asked and people do give the same answers for the same reasons - but - this ensures that the questions & the answers provided are always the most relevant, the most well thought out, in-the-moment resources.

Storage is cheap these days but it’s worth thinking about why to archive information, why to keep resources - just because we can doesn’t always mean we should.

Using InVisions 'Boards' for Competitor Analysis

InVision - - is a great system for design discussion. The ability to quickly and easily create prototypes or just throw a quick sketch online for a distributed team to review & discuss has been a great addition to my UX workflow.

As well as a recent Material Design style update they have also recently been adding some useful features to move the system beyond basic design discussion and place it more to the centre of a complete design workflow. These features include mobile testing, Kanban style Workflow boards, mood & brand boards in their Boards feature & the soon to be added InSight & InBox.

InVision Boards

Working with the Spencer Group on a new internal, secure email system I was looking at ways to best discuss ideas with a remote team.

allowing me to keep all the discussion in one place in a system all the members of my remote team were used to using.

When designing systems and their associated processes I try to look at how others handle the same problems I might face as a way to gather new ideas or to avoid potential issues. In the past I’ve made use of various third-party systems such as Kippt, Google Drive & OneDrive to collect screenshots of design elements to share and discuss. The addition of InVision’s new Boards feature seemed a perfect alternative for these third-party systems, allowing me to keep all the discussion in one place in a system all the members of my remote team were used to using.

Competitor Analysis Board

I set up a Competitor Analysis Board within InVision to conduct an assessment of the relative strengths or weaknesses of similar, email focused products.

Competitor Analysis Board set up within InVision

This led with an explanation on how the team were using the Board to make it easy for anyone viewing for the first time to understand what they were looking at.

set a visual hierarchy within the page based on the number of comments an item had received.

Any relevant designs, images, ideas & inspiration could then be added to the Board to allow for the remote team to add comments. I had the idea to make use of the scaling feature found within InVision Boards to set a visual hierarchy within the page based on the number of comments an item had received.

easy to see on viewing the page which items were generating the most discussion.

An item with none or a single comment remained at the default size, once the item had received more than one comment, it’s size was increased. This continued as more comments were added meaning that it was easy to see on viewing the page which items were generating the most discussion.

Competitor Analysis Board showing scaling based on comments

To finish up this collaborative resource, I then made it clear on the Board that all members of the remote team could add to the board any items they might want to discuss. We also used this Board to pull out relevant colour ideas for systems we thought made good use of complementary colour schemes, or who displayed good contrast for call-to-action buttons.

Competitor Analysis Board showing colour swatch ideas


By making use of InVision’s new Boards feature - - I was able to quickly develop a system to perform useful competitor analysis inside a design discussion framework already know to everyone on my remote team. While not specifically designed for this use, the flexibility InVision offers made it an ideal tool. Here’s hoping that the upcoming InVision updates mentioned above prove to be just as useful.

Demonstrating Animations & Transitions in InVision

A quick tutorial on how to capture animations and transitions into InVision for design discussion.

The web is not a static medium. Animations to offer visual feedback to a user are becoming commonplace as the technology to easily accomplish this becomes more prevalent.

InVision - - is a great app for design discussion and prototyping but demoing animations & transitions that are an integral part of the prototype is currently not a documented feature.

As a requirement arose to allow a distributed team to view these animations I worked out the following solution. While not as smooth as the usual InVision workflow, it still works well for required use cases.

Firstly, an additional piece of software is required to capture the animations and transitions as an animated gif. For this I recommend the open-source and easy to use LiceCap - This offers a cross-platform solution for Windows and MacOS (it should also run under Linux using WINE or alternative options can be found in this thread -

Initially, use LiceCap (how to record with LiceCap demo here to capture an image showing the animation you would like to add to InVision for discussion.

Example animation captured using LiceCap Example animation captured using LiceCap

Keep this image simple, if you have multiple animations, record them separately and upload as individual screens to avoid confusion around comments.

I’d also advise not demoing transition between screens using this method as any comments added may lose context as the animation moves between the different screens.

Once you have captured the animated image, simply upload to InVision as normal and add comments where required.

Animation uploaded to InVision with an added comment Animation uploaded to InVision with an added comment

This allows a distributed team to make use of the features contained in InVision while allowing relevant animations and transitions to be viewed and commented on.

EU Consumer Rights Directive

Having recently been doing some research around the EU Consumer Rights Directive - - this post collects together useful information for retailers based in Europe

Various EU Currency Various EU Currency

A useful overview from The Guardian -

Consumer Rights Directive 2014: Why It Could Be Good News for Ecommerce

The EU Consumer Rights Directive: should etailers be worried?

Why the EU’s new directive could help you nail online customer experience.

The EU Consumer Rights Directive 2014 explained - a very useful overview and explanation from Joanna Perry

The online implications of new consumer rights legislation - useful look at the directive from Internet Retailing

EU Consumer Rights Directive: A top 5 checklist for the digital retailer - handy checklist from Session Digital

Hopefully this information proves useful for anyone looking for information and guidance around the recent changes.

If you know of any other useful resources, please let me know and I can update the article.

Useful Resources for Learning Typography Theory

A recent question on useful resources for learning typographic theory had me digging through my old bookmarks to find the most useful. This post is designed as a future reference and a way to collect these resources together.

Butterick’s Practical Typography

Butterick's Practical Typography

An excellent resource by Matthew Butterick ( who also created the legal specific resource. Practical Typography offers an excellent overview of typographic theory and is an excellent starting point for learning more about this area.

The Elements of Typographic Style Applied to the Web

The Elements of Typographic Style Applied to the Web

A web–specific version of the excellent Elements of Typographic Style book maintained by Richard Rutter. Very useful overview and intro to the more in–depth and non web–specific original.

Typekit Practice

Typekit Practice

Useful lessons and references regularly updated and maintained by Adobe Typekit.

Thinking with Type

Thinking with Type

Website to accompany the Thinking With Type book ( While slightly dated now, the typographic theory is still relevant today.

Now Buy the Book

While all these are useful online resources, one of the best investments I can recommend when it come to learning typography is to purchase a copy of Robert Bringhurst’s Elements of Typographic Style (

Elements of Typographic Style Book

Having a copy of the book to hand and seeing the typographic theory applied in print can really make a difference to really understanding what is happening and why.

Hopefully these resource will prove useful when looking to learn about typography.