Inspiration
We took inspiration from the GUI provided by WalletWallet to see what their API is capable of and attempted to make it more user friendly and in-line with the Romax branding.
What it does
Our application generates bespoke wallet passes based on information provided by the client. This is compatible with Apple and Google Wallet.
How we built it
We built this using Next.JS with Typescript leveraging the WalletWallet API to generate signed pkpass files ready for use avoiding the need for the appropriate developer accounts on both apple and google's ecosystems.
Challenges we ran into
Unique QR code generation
- Generating a QR Code on the editor that can be scanned from a mobile device proved more difficult than expected as the pkpass file is too large to be contained in a QR Code. We created an API endpoint which took a list of parameters in a url which would return the file allowing it to be scanned on a mobile device. (With the right network setup)
Managing fatigue
- As this was our first hackathon we struggled managing sleep and work .
Accomplishments that we're proud of
Live preview
- Our live preview feature was hard to implement require a bit of research to learn how to autoupdate fields when a change is detected
Pass Generation
- Our backend successfully receives pkpass'es from the WalletWallet API with the custom data provided.
What we learned
We have learned quite a lot about how to manage workloads under time pressure and the hackathon experience has been invaluable. We all had previous experience with Next.JS but we was glad to have the opportunity to further these skills.
What's next for ROMAX FIsCH
We experimented with a few ideas of automatically populating customer data through their websites. We had two paths for this: AI & Traditional web scraping. The AI approach was much more effective at extracting the information from the webpage however is less cost effective and requires a powerful model unlike the local models that were available to us. Traditional web scraping did not yield accurate enough results from the limited amount of tinkering we did with it.
We believe a combination of these approaches would be the key to automating the process.
We would also like to implement a design assistant popup to advise the user when designing if they are running into accessibility issues.
Built With
- applewallet
- googlewallet
- next.js
- typescript
- walletwallet
Log in or sign up for Devpost to join the conversation.