EditMode

Ciarán Hanrahan

Product Designer
Web Designer
Figma
Notion
Editmode
EditMode is a site editing toolkit that makes it super easy to enable real-time inline editing on websites and web applications.
EditMode is the brainchild of Tony Ennis. Tony is an entrepreneur and developer, and like myself, knows the pain of managing, updating and deploying content changes on websites and applications.
My Role
I led product design for a small remote team based across the US, Ireland and the Philippines looking to solve that problem. I was hired to design the entire EditMode experience across all touch points.
This covered the products offering for developers (a getting started guide, interacting with the API, integrating an existing site, client handover etc.) and the product offering for client handover (the inline editing experience and a lightweight CMS).
The Website
The landing page's primary goal was to show developers the beauty and simplicity of the EditMode product. We needed to illustrate how easy it was to get setup and to start interacting with the API and how quickly they can integrate EditMode with their existing development stack.
Secondly, we wanted to showcase the simplicity of the inline editor, and the extra features within the CMS that they could hand over to their clients to ensure all their needs were met from start to finish.

The CMS

A simple interface paired with powerful capabilities
The goal was to design a simple and un-opinionated CMS that always put an emphasis on displaying just enough functionality to cover the majority of use cases, with complexity cleverly hidden for those who needed it. This hidden functionality would allow developers and power users to configure things where needed, but for the majority of cases it simply update the content and click save.

Quick & Easy Setup

Getting EditMode setup on a website is surprising simple. I designed a setup guide to walk developers through the steps to get setup.

Reliable content deployment

EditMode comes with some really nice features like branching to allow multiple people to work on content without any conflicts and to allow reviews before deployment; version history, making it easy to see who changed what, and to revert to previous versions of content.

The Inline Editor

The real beauty of using EditMode comes down to being able to edit a website inline, without needing to go near the CMS. The magic layer (EditMode.js) allows developers to specify editable content areas within the site, and their clients can simply point, click and edit. It really is that simple.
EditMode is an ongoing project and I look forward to working with the team to continue to improve it.
Thanks for reading!

2020

Partner With Ciarán
View Services

More Projects by Ciarán