How I built an app for a recycling centre in 3 days using Coda
Creating a product we couldn’t finish in months of volunteer effort
Remote working and giving back
I started working remotely in 2017 and since then I had the opportunity to travel more and spend longer time in a few new places. Indonesia was one of the firsts and it took me only one rainy season to see the sheer amount of trash that flooded every single road side, river and beach making you swim between plastic bags, nappies and rotten dogs (yes, twice).
Why this happens is a whole other story, but in short, we’re all kinda guilty. Feeling conflicted between how tourism is part of the cause of this and my privileged situation moved me to join a non-for-profit organisation trying to improve the waste management and recycling in Indonesia.
The project aimed to change the waste management infrastructure bottom-up: what is now a fully private, centralised and over-loaded system will be challenged by a community-owned, decentralised and value driven solution.
The recycling project in Indonesia
When I joined the team, consisting of only volunteers, it was the time they were planning to work on building a webapp to monitor the efficiency of their first recycling facility. It was clear that no strategy nor design work had been done before and the team was facing already quite a few challenges around complexity and clarity.
After I got to know the, back then tiny, team better, I introduced a User Centred Design approach. Additionally I suggested a Lean process to slim down the problem to the most urgent needs and focus on developing only fewer things, faster. The design approach was well received, the lean process not so much, more on this later. We started collaborating on a few workshops to define the users, their needs and the whole service map.
Once we had identified a whole bunch of features, the idea of a weekend-long development-sprint was suggested, and the lean process was forgotten.
A 72-hour burst of energy to complete a now quite ambitious project sounded grand and excited the developers. Since everyone was volunteering I thought it was a good idea to let the enthusiasm lead.
Except it was not.
We set a date for the event in a few months time, then I started leading other 3 designers to make sure all assets required for the development weekend would have been ready on time. We agreed to use an existing React.js component library from IBM to keep the frontend work slim and sacrifice some design customisation to have a working first version faster. A few months of iterations later we got all the design and specs ready for the development weekend.
The development day arrived and so did the challenges. On the first morning was decided that a new stack would have been used instead of the existing component library (🤷♂️), some people didn’t show up, the development effort wasn’t prioritised and so we ended up with a half-baked product, a couple of working features and a lot of dummy pages.
The webapp was now playing a sound every time a data was entered, but wasn’t able to display all the data. #priorities
Seventy-two hours later everyone was exhausted the product wasn’t nearly finished, the energy dropped and the momentum around the app dipped pretty much forever. I left Indonesia.
Mexico and the ProductHunt challenge
In early 2019, I decided to travel to Mexico. Unfortunately, it didn’t take me long to find similar issues around waste management and recycling, although not as bad as in Indonesia. Luckily it also didn’t take me long to find another local organisation that is working to solve the waste problem in Mexico. Their goal is to create a community around reuse and recycle, where the income generated from recycling goes towards a Creative and Cultural Centre.
We met and I explained to them the work we’ve done in Indonesia, the differences between the projects and the challenges we’ve faced. We wanted to find a way to use the lessons we learned back then.
Shortly after meeting with the non-profit, I heard about about a no-code challenge to build a new product in one-week time, promoted by ProductHunt and Coda. I had no idea what Coda was, but a few friends were participating so I thought to give it a shot and see if I could make something out of it (or at least learn something new).
It didn’t take me long to realise how good of a match Coda was for the app we wanted to build back in Indonesia.
I started playing around with Coda and used the strategy and design work done previously to guide me through the creation of the app. It would have limitations compared to the custom developed app (no multilingual, simplified data manipulation and visualisation, etc) but it would be good enough for an MVP. In a few minutes I had a simple data input table form and a chart page to show the data in a friendly format.
I started adding more data and more charts, a few more complexity and options, and in a couple of days of work (plus all the months of work done before) I got to a functioning MVP.
The app didn’t get to win a prize in the challenge, but got enough traction to inspire people to learn more about the project. Hopefully the start of something new?!
My process working with Coda
What is Coda?
During the first minutes working with Coda I had to realise what this new tool actually was and what I could make out of it. In short, you can create a document with pages where you can use custom tables as data entry forms and manipulate data into other tables or visualise data in charts. Pretty much a mix between a Word doc and a spreadsheet. The cool thing comes when you get to open your document in the Coda mobile app where your raw pages and tables are transformed into a fully native app optimised for data entry.
Data entry and visualisation
Creating your first table is pretty straightforward, you’ve got to add the columns you need with the data-format you want and you have an inline data entry form in the last row. To show that data straight from the table or after some simple math you can just create a new chart and reference to your data, I reckon pretty much as you would in a classic spreadsheet. The charts are still simpler than on a spreadsheet, but Coda offers a more organised way to present them.
Creating settings and options
Next, I wanted to see if the app I had prototyped could be a bit smarter and see if I could get a few things working:
- offer a controlled way to insert data only of specific values. Eg. when adding a new material, the type of material (plastic, glass, metal) must be selected from a list.
- filling data in new lines automatically. Eg. the price of a recycled material would update automatically based on what material has been chosen.
- have a “control panel” where some options could be easily edited. Eg. adding a new allowed material type, change the fixed prices of a material, etc.
I was lucky to still remember a thing or two about databases from my Computer Science degree. I started creating index tables with, for example, material types and prices. I used a “select list” column to specify the only possible values (eg: plastic, metal, glass) and made another column to input the set prices (eg: plastic is $5, metal is $10, glass is $20). With this index table, I can now reference that data from another table with a few simple formulas. For example, I can track inventory in a table and enter 2 units of glass. By referencing the index table, I won’t be able to mispell “glass” or enter a different new material, and the total price will automatically be calculated as $40 (glass $20 * 2 units).
The future of waste management and recycling
Recycling and waste management in general are currently based on a largely broken system, especially in rural areas. The problem is that the value of the material (not waste!) is not visible in the community where the effort to recycle is made.
This project aims to democratise the recycling system and shows the real value that anyone can make out of recycled materials. Even though projects like those in Indonesia and Mexico are relatively in their infancy and data is scarce, it’s a model that is already working, an example of circular economy at its finest!
Transforming well separated material into value and keeping this value in the same community producing it.
Unfortunately, all these projects are moving forward mainly thanks to the effort of passionate volunteers, but this makes the progress slow and scattered. My dream is to keep assisting these teams or any other organisation facing a similar scenario and build the tools that can help them optimise their job and show the value of their work.
Thanks for reading.
♻️ Check out the Recyclify Coda doc ♻️
🙏
