Be realistic and we won Hackathon 2019


The moments are unforgettable. Good venue, good time, good participant, good team, cool T-shirt and …. good price!

End game, I’ve intended to have this post published immediately… Only holiday enabled it

Since I joined the Hub, I paid all my time trying to catch up with the team, and do QA things. Hackathon is not in my list at all. Although @Quang Nguyen (VNCOE) suggest me to team up for an AI for testing, @Nam Duong (VNCOE) encouraged me to give any idea, I just smile to … excuse. Sorry for having you discouraged 2 bros. Therefore, I would like to say thank you to all the ideas submitters, who have search/share/shape up bright light spot for my eye. Your ideas are all “Interstellar” merits.

I know I can build something, but not big things, then the old-fashion idea brought about by @Trung Nguyen Duc was my first choice. Not much tech-advance, no creative, therefore no transformative, then just make it extremely realistic. WORKING DEMO is a must, and all team keep this in mind.

Very fast, we teamed up and move to level 8 to start.

Getting started

We have made a mistake during team up time. @Hieu Ta (CBA – COEVN) know this 😀 

Idea to Stories & Sketch ups

In the next 2 hours, around the board,

  • @Trung Nguyen Duc refine requirement as an BA
  • @Thao Truong (VNCOE) ask question as an end user.
  • The others and me in turn clarified, add more, reduce more, consolidate …

ten ten

Just practice what we do everyday,

  1. Feature first, scope it down to be small enough to build, but be rich enough to win the price.
  2. UI/UX later

We talk about a how the whole system is initiated, how book go to the library, how QR code is generated, attached to the book. And immediately, the technology quick enable it. Result: A simple Web built with ReactJS connect to Firebase database.

Then the talk focused on how user will interact with the solution and got what they want. Result: A mobile app built with Flutter, which will scan QR code and offer action.

Actually, we decided to have mobile first solution. Initially, we think of web-for-admin, mobile-for-staff. Later we asked why not mobile for admin too? It is just a good view to simplify user experience but increase in mobile-dependent development. Team are not all mobile expert, even worst when we choose the new tech to challenge “Flutter” We keep the initial design, then we have two “Product” Admin web with React & Mobile with Flutter. All are backed by Firebase database.

@Trung Nguyen Duc @QuanTo @Cuong Dong (Donut) and @Nguyen Duong keep the mobile screen flow short as Login -> Scan -> Action -> Success.

The //TODO

The only girl Ms. @Thao Truong (VNCOE) give the first hand   “I can’t code, then what I can help? ” :light_bulb_on: “For the demo, we will need presentation slide, printed QR code, some books, T-shirt.

@Trung Nguyen Duc raise one rule   Direct face to face for communication.

And we still use Slack for code snippet sharing. Once every body on Slack, repo (Github) is created, we go for …. lunch.

Coding Started

Right after the mobile team and web team init code base, @Kien Dinh promote the database model for integration. We have reduce the DB design to fit the scope. Some minute after that, we deployed the model onto Firebase and check it.

And right after the database, we have data sample for QR code.

On the other side, web for admin is deployed

Meanwhile, We have QR code scan functioning developed and luckily, I got the 1st Pull Request for QR code Scan for @Cuong Dong (Donut) to review. It’s 3:36 PM and all of us still being motivated. Obs, I was tagged the wrong person

The day is continue until night with the roadblock is React with Firebase

Second day

I come to the office late on the second day when every body have stood up and is on working, my bad

Clean all up

The database was even optimized to reduce unnecessary relationship and I/O efficient

Thinking again for UX, there was a debate Do the system need an explicitly user role admin during the the library is initiated. Can it be simple that if we scan a code that mean nothing in the database, then invoke add_thing flow instead of exchange flow. The admin is just a user who keep book. But we stop debate and build with current-easy-to-understand concepts.

Result: Nothing change, back to code.

One hour later, the mobile app is ready to serve. I theme it with amber color as we are all good with it.

First build to android is success and we now can scan the code. I stop coding, @Nguyen Duong begin refine UI, @Cuong Dong (Donut) solve dataflow ande release 1.0.0.

@Trung Nguyen Duc said it will more fancy for use to demo both Android and iOS. That is the time team realized that

Taking this task, I tried to

  • liaise the designer from the next team to borrow her Mac book. Got ‘No’,  😐

  • move and ask @Phien Tram (BAMBOO) , my Joker Team buddy for support. @Phien Tram (BAMBOO) was so great to support and keep care on us till demo time, but @Hieu Ta (CBA – COEVN) was not as a team defender. I have to leave Lv5 later 😐 

  • Tried to use pubic CI , but no help.

  • caught @Lan Dang and he offer me a brand new MacBook around 12:30 PM.

There was no XCode installed. Tried to install every things but timed up and I don’t have iOS developer account. No iOS demo is performed  😐

Wire them all and rehearsal

Lunch is coming, we decided to make it fast for the price. 

It distributes the team into 2 corners, slide review, demo fix; just look like minimized Sale-team & Incident-Support-team

Team Selfie

And this is all what was behind the scene.

The team was perform so good. We share and learnt together. I instantly learn and share the basic concept of stateful/statless Widget tin Flutter to NguyenDuong, I learnt Firebase from the team. See the PowerPoint animation skills from @Trung Nguyen Duc (yes, it’s Trung) and sure the others learn and shares.

So what will we do with the prices?

@Lan Dang will love this as he is invited for his helpful support.

Future thought

The solution was so potential to be deployed for Tyme in production mode. We public the code base and got all the ideas from audience to help it a full featured solution

  • Integrate with current Tyme Azure Active Direactory

  • Manage all kinds of Item, not only book and T-shirt

  • so on.

To be realistic, every thing will be delivered on true demand and resource available. Let’s be calm and look into the future.

28/04/2019 by Q.T

id luctus dolor. Nullam dictum dolor