Building a feature from UX to Code
Better Proposals is a cloud-based software that enables its users to create, send, and track documents easily and efficiently. Although their editor is excellent, heavy users require a tool that can save them more time when creating documents. That is precisely why the Document Importer Project was developed.
My Role
Product Design, Interactive Design, Front-End DevelopDuration
6 WeeksTools
Figma, FigJam, PHPStorm, XAMPP, GitHub, JiraDev Stack
HTML/CSS, Javascript (Vanilla) and JQuery, PHP, MySQLBusiness Goals
Make document creation and styling more efficient and user-friendly. This benefits a wide range of users, from salespeople who need to send multiple documents daily basis, to corporations that have content-heavy documents and want to save time by avoiding manual copying and pasting.
User Goals
Streamline the document creation process to save time, and also reduce the possibility of typos or missing information.
Web Development
Collaborating with a colleague, I focused on front-end development and integrating it with the back-end they developed.
- My main goal was to improve the user experience through visual feedback and informative content at every interaction stage.
- I also conducted tests on diverse .docx documents, including those from Word, Google Docs, competitor platforms, and pre-built templates.
Changes on the fly without unwanted surprises
In order to meet platform-specific requirements, users should divide documents into sections and blocks. The interaction design and layout were carefully thought out, showing a preview to help the user understand how their document will look at the end.
Goodbye, boring PDFs. Hello, digital branded documents.
In the final step of our process, we provide assistance to users by offering:
- Pre-defined colour combinations.
- Generated images from free stock websites. This allows them to style their documents quickly by simply typing in a keyword representing their business.
- The alternative to further customise their documents by editing text, changing colours, moving sections and more.