Role:
Project Manager and UI/UX Designer in a team of 8
Tools:
Figma, Jira, Slack, Google Spreadsheet
Completed:
12 weeks
Overview
The idea started when one of our team members shared the struggles her family is facing with their copra buying and selling business. Their problems with their process includes logging each transactions manually, calculating and updating rates for copra sellers and checking inventory.The daily fluctuation of market rates is challenging to calculate and update for copra sellers. Logging stocks and inventory is done manually, making it time-consuming to keep track of coprafrom each seller. Our team found an opportunity to help copra business owners address the problems with their manual processes.
CocoTrade is an all-in-one web app that offers a paperless inventory and sales management system to copra traders. With CocoTrade, business owners can easily view their monthly and daily transactions. Additionally, they can set their own copra prices based on the world market price and keep track of their purchases, observing trends from daily to yearly.
Week 1
Concept Ideation
Before we came up with the project, we first conducted interview to understand the current market needs. Subsequently, we convened to exchange ideas, define the problem, identify opportunities, propose a unique value and assign team roles.
Week 2 & 3
Further Research, Pre-Design & Development
Our team focused on further research, preliminary design and development planning over the following weeks. This included analysing competitors, establishing user persona and finalizing the main features. We then started creating the user flows and mid-fidelity wireframes. The design team began collaborating with the development team at this stage, allowing them to start selecting the technology stack, designing the database, and plotting the system architecture.
COMPETITIVE ANALYSIS
SAP offers multiple features that streamline solutions and can be tailored to various industries. However, the broad spectrum of their features can be a disadvantage as customization on their platform to fit specific business operations can be complex and time consuming.
SITEMAP & USERFLOW
USER PERSONA
MID-FIDELITY WIREFRAMES
Week 4, 5 & 6
Branding, Interface Design & Prototype
During this stage, our team have started working on the branding of CocoTrade. The design team have also created high fidelity mockups and develop prototypes to demonstrate interactions and animation.
CocoTrade Graphic Design Works
FINAL MOCKUPS
Purchase
Tracks all copra purchases, providing detailed logs of transactions, farmer details and prices. Ensures accurate records and efficient inventory management
Sales
This feature streamlines copra sales by enabling easy listing and order tracking. It offers real-time sales updates and in-depth reports to optimize operations and boost profitability.
Inventory
Keep track of your purchases and observe the trend from daily to yearly
Finance
Take a quick glance at your monthly and daily activity to track purchases and sales.
Week 7 & 8
Design Hand-off
After finalizing the mockups, we added notes to some of the screens for the developers, explaining the animations and behaviors of certain functionalities and features. We also created a document which consists of the design system for the developers to follow. The design system includes input fields, buttons, badges and progress bar to name a few.
NOTES FOR THE DEVELOPERS
DESIGN SYSTEM
Week 9 to 12
Alpha & Beta Milestone
During the alpha and beta milestones, the design team conducted quality assurance by filing bugs and errors in both the frontend and backend via Jira. Through this process, we were able to identify issues in our platform and fix them before the final presentation.
Post Mortem
After the project was finished, our team held a post-mortem meeting to discuss what went wrong and what went right. During this meeting, we identified improvements we could make for future projects. One key lesson our team learned from this project is the importance of communicating more effectively, especially when adding new assets and components, and ensuring design changes are communicated clearly and promptly. Given the scale of the project and the fact that we were only given 12 weeks to design and develop the app, maintaining consistency was challenging.