Inspiration
We were inspired by the ranking concept used in games and began to think, 'Why not introduce this fun feature to TikTok's shop?' Therefore, we decided to integrate a 'Snake and Ladder' game into TikTok shop. Our aim was to attract more users to download and make purchases on TikTok.
What it does
When a user presses the crown button on the top right screen of the TikTok app's shop tab, they will be directed to the rewards page. On this page, the user can check their tiers and the number of Experience Points (EXP) they have earned. EXP is accumulative with no expiry date and can be earned through daily quests and playing the 'Snake and Ladder' game. In the 'Snake and Ladder' game, a personalized icon will indicate the user's path and current position. The boxes on the 'Snake and Ladder' indicate different (EXP) ranges. After exceeding the current range, the user will move on to the next box. When the user lands on the box with a ladder, he can invite a friend to download TikTok so as to move to the end of the ladder, earning a huge bonus of EXP. However, when a user lands on the snake tail, he has to ensure that he remembers to check in for 3 consecutive days or else he will move backwards and have his EXP deducted.
Within the rewards page, users can tap the question mark button to access a description of how this tier feature works. The description page will include the details of all the different tiers. To elaborate, a user will automatically qualify for the bronze tier after making his first purchase on TikTok. In the Bronze tier, the user will enjoy a 5% shopping discount for all future purchases. For every $1 spent, he will earn 10 EXP. When the user hits 2,001 EXP, he will be upgraded to the Silver tier, where he will enjoy a 5% shopping discount and 3% cashback points for all future purchases. For every $1 spent, he will earn 12 EXP. When the user hits 6,001 EXP, he will be upgraded to the Gold tier, where he will enjoy a 7% shopping discount and 6% cashback points for all future purchases. For every $1 spent, he will earn 15 EXP. When the user hits 10,001 EXP, he will be upgraded to the Platinum tier, where he will enjoy a 10% shopping discount and 7% cashback points for all future purchases. For every $1 spent, he will earn 15 EXP. Additionally, Gold tier and Platinum tier users are also entitled to Free Express Shipping. Cashback points can be used to deduct up to 60% of the total amount of products when the user makes a purchase. The points will expire six months from the date they were earned and any unused cashback points will be removed from his account.
There is also a 'Get more points' button that leads users to a page with Daily Quests and Achievements. Users can complete daily quests such as daily check-in, being online for 30 minutes, and inviting a friend, to earn bonus EXP. The achievement tab will show the progress of the user and the user can earn more bonus EXP when he unlocks an achievement.
Within the rewards page, users can tap the question mark button to access a description of how this feature works. There is also a 'Get more points' button that leads users to a page explaining various ways to earn more points.
Members
Luo Yu: I'm a Year 2 Computer Engineering student at the National University of Singapore, characterized by my ambition and a nascent yet enthusiastic pursuit of knowledge in this field. My aspiration is to acquire advanced proficiency as I progress in my academic journey. I derive personal satisfaction from the process of acquiring new tools and frameworks and experience a deep sense of accomplishment when my codes yield functional results. I'm grateful to have this opportunity to participate in this hackathon as it has truly tested and stretched my capabilities to their utmost potential.
Chan Yon Nan: I'm a computer engineering student from NTU who's really into making websites look awesome and function smoothly. I'm learning the ropes of designing and building user-friendly websites. I'm always excited to explore new web tools and design concepts. My goal is to make the internet a friendlier place, one website at a time.
Tan XuanYou: I am currently a Y1 computer engineering student from NUS. I am a tech enthusiast and always think out of the box to resolve knotty questions. As an eager learner, I am actively engaged in the development of front-end skills and the exploration of blockchain technologies. My ultimate goal is to apply my coding expertise for the betterment of the community and to offer support to those in need.
Lin Weilin: I'm a Y3 Computer science student from NUS who is interested in frontend design and game development, I really like to see how users would enjoy playing the games I designed and hope that in the future I can create a game that can be played by many people
How we built it
To ensure efficient progress, we broke the project into several manageable parts. As we worked on these individual components, we continuously collaborated and cross-checked our results with each other. This approach helped us maintain focus and ensure that our efforts were aligned with our overall goal.
Challenges we ran into
One of the significant challenges we encountered was insufficient resources to fully develop our project. We also faced the hurdle of working with tools that were entirely new to us. Despite these obstacles, our team persevered and successfully navigated these challenges to bring our project to fruition.
Accomplishments that we're proud of
We promptly resolved critical bugs and issues, leading to improved application stability and increased user satisfaction. We also managed to submit the project on time despite having no prior experience.
What we learned
Throughout the project, we gained valuable experience in using tools like React Native and various GitHub operations. Additionally, we discovered the significance of teamwork in the development. Besides, we learned how to work under stress as we had to learn everything from scratch within a tight deadline.
What's next for Connect4More
We are committed to enhancing the user experience by further improving the aesthetics and functionality of our feature's user interface. Additionally, we will integrate it with a database to enable seamless data management, storage, and retrieval, thereby ensuring a more robust and feature-rich application. We are also ready to resolve any bugs in the project.
Built With
- expo.io
- javascript
- navigator
- react-native
Log in or sign up for Devpost to join the conversation.