Charlotte Mae Efren | Pixelmai

— Project BrieF —

POP is a software as a service (SaaS) that provides users an effective way to create, send, approve, and monitor purchase orders. Its features included advanced user access settings, cash-flow control, extensive reports, and Xero integration. The users must be able to manage their purchase orders anywhere—to provide this feature, the web application was designed to be fully responsive.

— Roles and Responsibilities —

Design Lead, UX/UI Design, Front-end Development, Responsive Web Design

The web application’s overall user experience and interface were designed by me. Tasks for this project included the creation of low and high-fidelity wireframes and detailed designs. The web application had to be fully responsive. Additional screens had to be designed to provide the seamless experience of using the features in different devices. The web application was checked in multiple devices (desktop, tablet, and phones) and web browsers for compatibility and consistency.

Additionally, coding the front-end prototypes using HTML, CSS, and jQuery was also my responsibility. The project had a tight deadline, so I managed a junior developer to help in the coding of the front-end markups, ensuring the design and coding standards are consistent.

Finally, I also collaborated with a team of developers implementing the back-end code of the web application. I had to ensure that the flow and transitions when navigating the application is seamless.

— Tools and Technologies —

Design: Adobe Photoshop, Adobe Illustrator, Adobe XD
Development: HTML, CSS (Bootstrap), jQuery

— App Preview —

The video below provides a quick tour of the features of the POP web application.
These are the front-end markup coded using HTML, CSS, and jQuery.