Intro
Welcome to part two of this series where I share 10 SaaS platforms with beautiful UI/UX design. We looked at some amazing software designs in the first article and here we have 5 more great examples.
These are particularly great examples if you’re a SaaS founder or are working in a product-related role. All of these products represent an exemplary standard of UI/UX design and are notable for their elegance, simplicity and ease of use.
Airtable
Firstly, we have the highly versatile application, Airtable. You can think of it as beautifully designed spreadsheets combined with the power of databases, if you’re unfamiliar. You can create business solutions and even build applications.
It has a colourful interface which reminds me of tools like Asana and Miro. This playful colourful styling is suggestive of the versatile nature of the tool. Additionally, this plays upon the concept that the only limitation for functionality is the user’s imagination.
Taking a look at the interface it’s easy to understand. Work is managed in “Workspaces” and projects are referred to as “Bases”. Navigating this is easy as you have a clear and simple user dashboard with a left-aligned menu for navigation. If you rearrange items in your menu it reflects by updating your workspace too.
Bases
Now, what I would refer to as the main area of UI design is within the Bases themselves. These are the key workspace areas that could be best described as a kind of spreadsheet project layout.
Opening a Base you can see that there is a lot happening but the screen is cleverly organised. You have a very detailed yet manageable workspace. It’s immediately apparent that a tonne of product work has gone into this!
The first thing that is worth noting is the structure of the screen. The workspace uses full browser width and cleverly partitions the space into thirds. The controls for the last third are simple yet intelligently put together. You can expand, minimize and close this space based on your preferred view. Yet while you do this the controls respond accordingly by readjusting their positioning and format. Such a neat design to play with.
At the top of a Base, we have the filename, then a neat set of tabs for the spreadsheet. Immediately you start to see the complexity.
There’s a custom right-click that enables you to easily make adjustments and edits you need to on the fly. There are contextual interactions that appear when you hover over items. For instance, the number of rows that become checkboxes when you hover on them. There’s also a cool plus icon for adding records to your spreadsheet.
At the top of the table, you have all the controls, filters and selectors that have cleverly designed overlays to interact with each element. This UI is a masterclass in a space-saving design. Little icons open up the power to do so much more.
Notion
Next up is Notion, an application that blends everyday work apps into one. It provides a workspace that includes components such as notes, databases, kanban boards, wikis, calendars and reminders. You can organise and manage your workflows as you wish.
The aesthetic is cool and clinical, predominantly using grey, white and black with splashes of colour in the icon set. It has a realistic illustrative style to it. There’s a serious business kind of feel to this, reminiscent of Evernote. In fact, I think Notion is the Evernote killer.
The thing that is most striking when you start using Notion is that you’re always in the workspace format. Even the onboarding checklist is a Notion document that you can begin editing right away. I love the way that everything you do is based upon the context of working in a Notion workflow.
What’s really cool besides the versatility and flexibility of Notion is the way complex UI is presented in the context behind simple interactions. For example, a forward slash keystroke opens up an options dialogue for the type of text or content you can add.
When you create a new document the options for the document type are there on the blank page.
Another great feature in Notion is the wide range of templates available for different document types. The options here present the sheer scope and flexibility of what you can do.
Two standout elements for me with Notion’s UI are the nature of the workflow and the less is more approach. The workflow is all inside a document, with just a simple navigation menu on the left. Notion looks simple but once you begin using it you quickly realise the power and scope of the software. Sometimes, less really is more.
Segment
Segment is software for managing customer data. It usually deals with integrating a source of the data and then connecting it with a destination.
I love the welcome when you sign up for Segment. The screen is completely cleared to remove all distractions. This allows the user to focus on building the first integrations and getting activated.
The standout impression for me with Segment is that the interface and experience are slick. We’re dealing with complex integrations which often represent tricky user journeys to connect data sources. Segment has clearly put a lot of effort into designing these journeys elegantly and making them as simple as possible.
Taking a look at one of these journeys, the options are really neatly presented. There’s a very cool feature for inviting teammates to collaborate on the integrations process. You can do this as well for document support and troubleshooting. Overall the UI is crisp, clear and generally easy to navigate.
For instance some apps I find confusing the way they deal with workspaces. Miro, for example,the workspaces and payment for users under different workspaces to me feel like a complete mess even though I love the product. On the other hand in Segment it’s super simple. The workspaces have been segmented off and you have a new screen for navigating and using them.
Pipedrive
Now let’s move on to my favourite sales pipeline management tool, Pipedrive. It is one of the first applications to introduce Kanban-style boards to the management of sales opportunities and pipelines. You could describe it as being a bit like Trello for sales. You have the ability to quantify deal values, see deal closing ratios and CRM functionality.
Kanbans
Pipedrive did a great job presenting an easy-to-use Kanban for this new use case. The ease of the drag and drop Kanban is one of Pipedrive’s defining interface elements. You can easily add opportunities directly into whichever column you need to. The transitions are smooth and the drag and drop works smoothly.
Navigation and Functionality
The navigation is simple and saves a lot of space by only showing icons and including tooltips to display the title of each section. Many apps that do this include an expand and minimize option for their site navigation. However, this example just shows how unnecessary that is when you keep the navigation simple and logical.
As with some of the other products in this list, there’s a lot more functionality than initially meets the eye. Another stand-out feature of the user experience is how Pipedrive presents functionality at the moment the user needs it. For example, when you hover over a Kanban board, an “Add” button appears. This enables the user to add opportunities to their pipeline. This type of interaction is replicated across the application and is a great way to embed rich functionality whilst maintaining a clutter-free interface.
Deal Screen
Pipedrive’s individual Deal screen is a great example of layout design. It enables the user to easily access all the deal-related information while also ensuring it’s easy to edit and update.
This screen uses space to present all of the relevant information pertaining to the deal. This including deal stages, contact information, value and activity. The tabs on this screen provide the ability to store all of the information the user needs to facilitate the progression of this deal. The left vertical column provides space for important information the salesperson might need at their fingertips.
There’s a lot more I could talk about but I’m going to point out one more thing I think Pipedrive does a great job with. It is the ability to upgrade during the free trial process. In the user’s trial account there’s a notification bar that alerts the user of the remaining period of their trial. This is paired with a call to action to manage their subscription. This doesn’t make it feel so sales-focused. By clicking on “Remaining Period” the user is taken to a screen presenting the pricing plans. The product navigation is removed to focus the user on the buying decision and a suggested plan is preselected. Pipedrive provides a really direct upgrade process and makes it really easy to buy.
Reply
Last but not least, we have Reply, a sales outreach and automation software. I’ve included it here strictly for its clean design and ease of use. There’s absolutely no fuss with the Reply UI and it has a refreshing look and feel. It’s design says “What you see is what you get”. This makes it refreshingly easy to use when so much other SaaS is getting more and more complex.
Reply uses mostly two colours and full-width horizontal navigation and layout. Very few of these navigation items actually have a submenu and the page layouts are clear and simple. The big red plus button which works contextually to add an item according to whatever screen you’re in. If you’re on the automation screen this button adds new automation. If you’re on the people screen this button adds a new contact.
Moving on to one of the main pieces of functionality, Sequences. Again I’m struck by the clarity and simplicity of use of this feature. Adding steps, editing them and creating your Sequences couldn’t be easier. There are clear selections for adding each step and then the options for selecting the type of touchpoint couldn’t be more straightforward.
Further to this, I would add that the customer service is responsive and great. There’s even a clever data storage plan if you want to pause your account. Reply is clutter-free, tidy, clean and a joy to use.
Honourable mentions
Finally here are a few honourable mentions. These came from my own research and from asking founders in my SaaS Founders Facebook group.
- 3veta
- Canva
- Crisp
- Dropbox
- Dropcontact
- GetFlow
- Harvestr
- Hotjar
- Intercom
- InVision
- Umso
Conclusion
There we have it, 10 SaaS platforms with beautiful UI/UX design. What do you think about these products? Please share your thoughts on anything like or dislike about these interfaces in the comments below. Also, did you agree with my selections? Let me know any SaaS that you feel has an amazing UI/UX too.
Need a Hand?
Interested in working with us to design an amazing UI/UX for your software? Just reach out to us at UserActive.io. You can book a no-obligation 15 min call with me. I’ll provide advice, give you a steer on your project and we can also see if we’re a good fit to help. If you’d like to join the Facebook group of over 10,000 SaaS founders, you can join here. In the meantime, I hope these examples of great interface design inspire you to improve your product, get more users and grow.
