WEEK11-WEEK14
NAME: JIN RONG
I.D: 0361701
COURSE: Application Design II / Bachelor of Design (Honors) in
Creative Media
Application Design II / Final Project
INSTRUCTION
Final Project
I used FlutterFlow to create a login page. The process includes
registration, login, and password reset. First, I configured the project in
Firebase and enabled email/password login. Then, I built the page structure
in FlutterFlow. The login page includes email and password fields, a login
button, and a "Forgot Password" link. Users can create a new account on the
registration page, and their account information is saved in Firebase,
enabling automatic login. If the user forgets their password, they can click
a link to the retrieval page. After entering their email address, they will
receive a password reset email. The entire process is primarily completed
using FlutterFlow's Firebase Authentication actions, which are intuitive and
require no code. After completion, I tested it and found the process to be
smooth and the overall experience to be positive.
After completing the login page, I began designing the ticket purchase
process. During this phase, I first modified the navigation bar to make it
easier for users to identify their current steps throughout the ticket
purchase process. Next, on the "Select Theater" page, I added a feature that
allows users to mark their favorite theaters with a "❤️" icon, making it
easier to access frequent locations the next time they visit.
On the "Select Seats and Time" page, I implemented a free seat selection
feature, allowing users to select their preferred seats and the number of
tickets they want. I also added logic to indicate occupied seats to prevent
duplicate tickets.
Finally, on the order confirmation page, I stored the user's theater, time,
seat, and number of tickets selected using Firebase and displayed them on
the page. To complete the process, I added a simple payment calculation
function—the system automatically calculates the total price by multiplying
the number of tickets by the ticket price, allowing users to clearly see the
amount they will pay.
After completing the ticket purchase process, I added a QR code icon to the
top right corner of the homepage. Clicking it shows the QR codes for the
movie tickets and food items you purchased. I save every user's order
information through Firebase, then read the corresponding data on this page
and generate a QR code for users to scan when entering the venue or picking
up their food. The entire experience is as smooth as possible, allowing
users to quickly complete the entire process from ticket purchase to ticket
collection without having to re-enter their information.
Final Submission
REFLECTIONS
This project was truly challenging for me. Honestly, there were times during the process I didn't enjoy. Although I was initially curious about using FlutterFlow to build apps, once I actually started using it, I realized it was quite different from what I had expected.
A lot of the logic required dragging and dropping, which was actually more complex than directly designing the interface. Functions like registration, login, and forgot passwords may appear simple on the surface, but they actually required a lot of small details: validation logic, redirects, error messages... Especially when working with Firebase, I often ran into issues where I couldn't figure out what went wrong, and the constant testing required was incredibly time-consuming.
The ticket purchase process proved even more challenging. I created screens for selecting a theater, choosing seats, selecting a time, and entering the number of tickets, and also configured payment calculation and data storage. To make the process as smooth as possible, I also made some adjustments to the navigation bar structure. However, the overall process proved much more complex than I had imagined. Often, adjusting the logic for just one button would take me hours and hours, and sometimes, simply selecting the wrong variable would cause the entire function to fail.
While there were certainly moments of frustration along the way, and I briefly lost patience with the tool, I ultimately managed to build a basic ticket purchase flow, with all the screens transitioning, saving, and displaying data as expected.
It wasn't my favorite project, but it did give me a clearer understanding of what I care most about when prototyping products, and it also made me realize there's still room for improvement in some technical areas.
I think if I were to work on something similar again, I'd use a tool that better suits my way of thinking, or perhaps create a clearer feature plan to reduce confusion. But at least, I persevered this time.
评论
发表评论