If the question: “what’s the best way to show a software product online?” has never occurred to you, that’s almost certainly because you have never had to do it. For those of us who have, it is a familiar decision - one that can cause quite a lot of debate.
In this short post, I want to walk through the options available and when you might use each. Depending on which group you belong to I hope you find it useful or at least educational.
Let’s talk first about the core issue. What do we mean when we talk about ‘showing’ a product? When we reflect on that desire, we realise that what we really want to do is communicate what our product does, and how it helps customers get the jobs done that they need to do.
So it’s not necessarily about showing product - in the literal sense - at all.
To make that more apparent, let’s look at three alternative approaches and discuss the strengths and weaknesses of each.
Show the ultimate benefits, or output, of the product
Our first alternative doesn’t involve showing the product at all, but what we might call ‘the end result’. Whilst there may be reasons why you don’t want to show your actual product UI, there are also excellent reasons to focus on the benefit even when you have the most beautiful product interface on the planet.
Of those reasons, the most important is hinted at above: we buy products to do specific jobs, not just for the thrill of it. On that basis, isn’t it a good idea to provide a visual shorthand to what getting those jobs looks like.
In the case of Zendesk (not our work) shown below, the company has chosen to illustrate what the interactions their software supports look like to ‘the customer of their customer’. They have also chosen to simplify that screen to ensure what really matters is communicated - a topic I will touch on later.
This isn’t what the UI of Zendesk looks like, but it gives us a very clear idea as to what the product is ‘about’, and it communicates very clearly what I’ll get done if I buy it.
You can of course go further. The next step would be to show the effect of this on the customer themselves - which is why you see a fair number of software products that show their technology through the happy faces on attractive people that it creates…
Show a simplified version of your UI
Although showing benefits or end results can be helpful, sometimes your UI does that anyway. It may provide a strong sense of the jobs that get done when a product is used. And if it looks good too, then that’s a bonus.
We recently worked on a new website for Effective Software. As part of that job, we spent some time thinking about how best to represent the product online. And whilst both Kooba and Effective wanted to give viewers a sense of the real UI, we wanted to ensure that a clear sense of the core functionality was communicated.
The result is below. These images have been carefully created to convey a true feel of the user interface and a true sense of the jobs the product does. But they have cleared away unnecessary clutter (in this context) to ensure those key points come across.
Perhaps most importantly, this is done openly and honestly. There is no attempt to convince anyone that this is the ‘real’ product UI (note the placeholders for text below). But in a meaningful sense, it is nevertheless an accurate representation of the product.
Achieving this balance is hard. But it can be done, and fortunately we have a particularly talented creative team!
Show the product as it is
Our third and last is the nuclear option: show the actual product just as it is! Many software companies default to this position, and it is relatively easy to see why.
Firstly, isn’t it obvious that potential customers will want to see the product?
Second, it’s the easy thing to do - just take screengrabs and put them somewhere in the design.
We answered the first point at the top of this piece, and the answer is ‘no’. Prospects don’t necessarily have a need to see precisely what your product looks like. With regard to the second argument I defer to JFK.
I would argue against taking this approach in most cases. The simple fact is that a product user can cope with a great deal more ‘data density’ in design than a prospect browsing a web page - so if your product looks great online there’s something wrong with your product, or if it looks terrible there’s something wrong with your site.
There are exceptions however. We worked recently on a new presence (including new branding) for Fing, a network management and monitoring service. As part of that project we chose to represent the product exactly as it is - shown below.
The Fing product is delivered within a mobile app, and the elegant, simple UI effectively communicated the core proposition when used on site. It works. But only take this approach when your unaltered product UI really is appropriate and communicates effectively. I think most readers or visitors to the Fing site would agree that this is one of those instances
As this last example shows, ultimately the choice is about what works for your business. Think clearly about best to communicate what you do. Look at your product from every angle. And don’t forget - within reason you can always use more than one approach.
