Designing Paperr
Paperr, is an online web editor that has been designed and developed with the intent of providing distraction free, delightful experiences for people who love writing. The project was started out of my own inability to find a clean, elegant and hassle free writing experience with inbuilt capabilites to perform minimum functions that improve the workflow.
The beta version of paperr has received great response from the entire web community with 8,000+ unique visitors and 25,000+ page views in the first seven days of the launch. The entire web community has given in great response with articles about Paperr getting featured in multitude of websites in multiple languages.
Behind The Story. Value Proposition.
Paperr was conceptualised with the vision of composing a writing tool that was hassle free, with great user experience and focus on writing. Here are a few key things that were kept in mind while conceptualising it.
What Makes It Incredible :)
Paperr has a bunch of exciting features including that have already been deployed in the beta version, while a few other features in the process of deveopment. Have a look at the current features.
Designing Paperr. Ideation and Brainstorming.
Paperr began as a side project, and I started to note down features that I myself would have had wanted in a web editor. And then I listed down all the features on the sticky notes and followed SCRUM methodology for the development.
Landing Page For New Users
While designing the landing page for Paperr, one of the major objective to make the focus of the project very clear through one line description about the product. The call-to-action button has been subtly placed so that the major focus remains on it. There aren’t any other visual elements around to disturb the simplicity of the page.
User Onboarding
One of the core aim that needed to be addressed for the onboarding of the first time users, was that they should be able to understand about product as quickly as possible. To focus on important features of the interfaces, I had designed visuals to demonstrate these features that would appear only to the first time users.
Paperr Editor
Paperr Editor has been designed in such a way that focus remains on writing while all the other features can be used as and when required.
The right top corner of the editor has a bunch of different icons which can be used to wiki search, email text, download pdf, print and full screen.
Tooltip Editor can be used to style the text. Currently the features that are supported are heading, sub-heading, paragraph, quote, create link, bold, italics and underline.
Wikipedia Search
A lot of time I faced this need to wiki search certain terms while writing essays or notes. So, I tried to integrate the wiki search in the editor itself. Though it is not the best method to implement, and I am still working on refinements.
Making Stuff! How did it all happen?
Development was done using multiple web languages incuding Javascript, JQuery, HTML 5 and CSS. I have used Twitter Bootstrap to set up the basic layout. Editor has been implemented using an open source framework, Pen. To implement the wiki search, Wikimedia API has been used and browsers’s local storage has been used to save the notes locally. Other javascript libraries including Countable.js and JSpdf have also been used to implement other features.
Putting It Across The Users! Public Beta.
The beta version of the product was released and below are the statistics for the initial seven days the release. The initial response was overwhelming and Paperr reached to the top of the feed for the day when it was launched on Product Hunt.
Studying about the user flow was interesting as most of the dropouts from the websites happened after the second interaction with the website and I am still trying to analyse user behaviour from the data from google analytics.
Currently, after three months of deployment, thought the number of users have come down drastically as I could did not had enough time to improvise upon it and make changes, but still numbers are good to motivate me enough to work more to improvise it.
User Statements and Feedback!
I received a lot of emails and comments, mentioning about what they like and dislike about paper. Here are a few user statements from Product Hunt Community.
In all it was a great time working on it and I would really love to thank Product Hunt community for providing an enormous network of makers and innovators that helped me to gain quite a bit of attention for Paperr!
If you have any feedback. Feel free to let me know of it :)
