SharePad

Online PDF editor for architects and engineers

April 2020 – February 2022

SharePad

Overview

SharePad is an online PDF tool that can handle biggest PDF drawings. You can combine drawings of any size to create a single overall view of your entire project. Architects and engineers can share an overall drawing by simply copying and sending a link to their colleagues on MS Teams, WhatsApp and email.

Team members and customers will be able to open PDF drawings of any size quickly and view all revisions in one place, on any desktop and mobile device.

My Role

As a Product Designer, I was involved in every aspect of the product development process:

  • Identified client problems and needs

  • Proposed solutions by creating prototypes and user flows

  • Developed a design system and created screens based on it

  • Wrote tasks for the development team

  • Tested the product and reported issues found to developers

The Problem

The client faced two problems while working in the field of architecture and engineering:

  1. Existing online tools process huge PDF files with drawings very slowly

  2. The existing tools do not provide the ability to place drawings in one workspace

That's how the client works with drawings in the real world, and I had to transfer those habits to the web:

In addition, it was necessary to implement secondary functions such as:

  1. Version control support

  2. The ability to edit the PDF file: cropping, drawing shapes, adding objects and text

  3. Comfortable work in the browser and support for any mobile devices

  4. The ability to share projects and files

  5. Different access levels for users

Plan & Research

The MVP (minimum viable product) created by the development department showed that we could split huge PDF files into many small ones and implement a “lazy loading” — the same technology used by Google Maps. That meant we could move forward.

The development process was divided into two stages:

  1. Implementation of core features for a quick beta launch

  2. Implementation of secondary functions during normal operation

I studied the main features of about 10 programs, both professional ones like Aconex, PlanGrid and Bluebeam Revu, and common PDF editors like Adobe Acrobat. I also studied drawing applications for tablets because I wanted my interface to work perfectly on all devices.

Next, I sent my questions and suggestions to the client. After receiving a response, with the help of the head of the development department, I divided users into groups and outlined access rights for each of them.

Below is only a small part of our discussions:

Wireframes

While working on the wireframes, I went through several iterations. I'll give an example of a simple improvement where communication among all team members is very important.

Improvement example

At first, I thought that the user needed to keep the window open to upload files, since the upload would be interrupted when switching to another page. So in the first version, we had a window that blocked the entire interface, which I was very unhappy with.

After asking the client about the average number and size of uploaded files, I discussed the problem with the developers. They assured me that it was possible to implement background uploading of files without any problems, so I was able to improve the interface by creating an unobtrusive upload progress window. This allowed users to continue working with the service while the files were being uploaded:

Color Scheme

At the same time, work was underway on the product's color scheme. The client had to choose from 8 options. For better perception, I demonstrated color schemes directly on the interface sketches:

Design System

A design system was created based on Google Material Design as the most universal and suitable for a cross-platform online product.

Each element was developed in all possible states:

User Interface

Based on the components of the design system, a user interface was built in three versions: desktop, tablet, and smartphone.

However, after the beta was released, I realized that it was necessary to show the developers a screen for each breakpoint: this was the only way to get a quality view on any device.

In the next iteration, I worked on each breakpoint:

Promo Website

To promote the service, I created a landing page with a unique design using Wix, which took me one day:

Also recorded a short demo video:

Launch, Test and Support

After the beta version was launched, I received feedback from the client and worked on implementing secondary features. Each new feature was thoroughly discussed with the client, and I created many prototypes to find the best solutions.

I tested the service and ironed out some technical issues. As a result, the development team received tasks from me to further improve the service.

I added 120 cards to Jira over the course of a year:

Outcomes

We successfully completed all project tasks on time and developed a revolutionary product that overcame the challenge of quickly loading and simultaneously viewing massive PDF files.

The client experienced a significant improvement in the efficiency of working with drawings, with our service showing a tenfold increase in the speed of loading large PDF files compared to other applications.

I really enjoyed working on the project because the tasks required in-depth research. I also really enjoyed testing the service, turning on my perfectionist mode 😄

The team continues to enhance the project and introduce new features, resulting in its growing popularity in the Australian market.