Tiktok Shop by Team Routourist
This is our team's reimagination of the Tiktok Shop Tab. Instead of your average e-commerce tab of simple product catalogues, we envision an exciting community within the shop where users can enjoy shopping together through interacting with like-minded shoppers, sending gifts to friends, and completing challenges.
Features
- A For You Page with a catalogue of products recommended just for you, along with flash deals and trending topics in Tribes
- Tribes: Join like-minded shoppers in communities known as tribes, and create discussion posts on product reviews, enquires, recommendation, shopping guides and more
- Quests: Participate in quests such as inviting friends onto the app and being an active member in a Tribe for Tiktok coins, which can be used to redeem discounts and cash rebates
- Wishlist: Share products that you really wish to buy with your friends and followers, and perhaps one of them might surprise you by buying you that product! And if you're feeling generous, fulfil a friend's wishlist in return
- Gift Finder: Not sure what to get for your friend? Choose the styles that your friend would like, and let Gift Finder recommend gifts for you!
Technologies Used:
For our frontend development, we chose to leverage the power of Flutter due to its exceptional capabilities in building mobile applications. On the backend side of our application, we harnessed the robust Firebase ecosystem. Specifically, we employed Firebase Firestore for efficient data storage and retrieval (where we stored our dummy data for users, posts, tribes, products), Firebase Authentication to secure user accounts and access control (for our user accounts, we only created a simple login/sign up flow with gmail and password as Tiktok already has a great login system, thus we chose not to focus too much on it), and Firebase Cloud Storage to manage and serve various forms of media assets (for our dummy data, we required many images of users, posts, tribes, products). These Firebase services collectively provided us with a scalable and reliable backend infrastructure to support our application's functionality.
Please refer to our Github repositories README.md regarding instructions on running the source code.
Challenges
Our team primarily consists of web developers. While the shift to mobile development was relatively seamless, there were challenges in translating intricate design details, and managing the confined screen real estate proved to be a task.
Venturing into mobile application development, especially with Flutter, was a fresh experience for all of us. It marked our maiden encounter with both the framework and its extensive widget library. However, thanks to the comprehensive Flutter documentation and the supportive community, we managed to quickly pick it up. Personally, I distinctly recall grappling with the Stack and Expanded widgets. I could never get Positioned to work and I found Expanded just a little pesky
Additionally, crafting the UI posed its own set of difficulties. We delved into extensive research on e-commerce platform designs, focusing on addressing common pain points such as cluttered interfaces, complex navigations, and uninspiring layouts. Some platforms lacked features we deemed essential for a seamless user experience, which motivated us to consolidate them into a single comprehensive platform.
About Team Routourist
Asyraf Omar:
University student at Singapore University of Technology and Design studying Computer Science. Specialises in web development with interest in AI and Cybersecurity.
Rachel Lim
University student at Singapore University of Technology and Design studying Computer Science. Specialises in fullstack web and mobile app development, with an interest in UI/UX design and AI.
Andrew Yu University student at Singapore University of Technology and Design studying Computer Science, with an interest in Machine Learning. I hope to witness the tangible impact of the products I help create, as I believe learning should be fulfilling!
Log in or sign up for Devpost to join the conversation.