Methods
Figma
Python
Hugging Face
Teachable Machine
Group Work
2023.Mar
Delft, The Netherlands
My Contributions
Web Design
Model Training&Analysis
Stakeholder Analysis
Areas
Web Design
Data Visualization
Computer Vision
THE CHALLENGE
Explore Models and Experiences in Two Weeks
BACKGROUND
Chaotic Bike Parking in the Absence of Bike Racks
Delft citizens' mobility has increased in recent years, resulting in frequent problems of chaotic bick parking and challenging urban planning.
OUR CLIENTS & USERS
The government is seeking feedback on a new bike regulatory system to increase monitoring of AFAC's bike removal services, promote more timely and reasonable bike rack planning, and reduce chaotic bike parking in Delft.

“We want to determine the most effective methods to assist us in monitoring bike parking directly with the help of Scan Cars”
Scan Cars: the municipality's eyes
They are used to scan streets for information for a variety of purposes. Delft is doing a test with cameras paired with computer vision models.
RESEARCH
RESEARCH
Gather Stakeholder Pieces
We spoke with one government official, two removal workers, and one rider to narrow down our goal with a comprehensive vision.
Municipality Clerk
“The bike removal shows low efficiency and high randomness.”
Removal Worker
“We won't usually tow bikes that are fastened to poles or trees.”
Cycler
“It's a bet; most of the time, I won't get penalized for improper parking, so I don't bother with a bike rack.”





Current Situation:
Regulate by AFAC (Bike Removal Company)
INSIGHTS


Unconfident of Bike Parking Distribution
The government cannot track clear data and trends to make bike rack iteration

Distrust for Bike Removal Company’s Progress
The extent of the government's engagement in the mutual enhancement of the bike removal company is limited.

Poor Manual Monitor Accuracy
Underreporting is typical because of the randomization of fine lists, which involve different times, different inspectors, and variable cycling conditions.
HOW CAN WE...
To Help Municipality Clerks Dominate Bike Regulation...
DESIGN
FIRST DRAFT
I created a search system using street scenario data that was filtered by area, bike quantity, and bike condition. The government can locate chaotic areas with ease and clarity.
FEEDBACK
Need To Be More Solution-oriented
The design did not assist us in developing our new solution.
Map visualization and priority functions can help the web become more solution-focused.
FINAL DESIGN

Grasp an overview at your options
Locate and check details
Use Ranking to find target easily
Set priorities and monitor progress
DATAFLOW
Design the Data System to Hold Users' Experience
FLOWCHART
Visualize Data Based on Users’ Primary Needs
To Collect Data Accurately By Scan Car...
PREPARATION
DATA COLLECTION
We conducted 200+ bike pictures in Delft city for model testing and analysis.
Data Locations: Prof.Schermerhornstraat, IDE Faculty, Martinus Nijhoflaan, Delft city centre, Papsouwselaan, etc.
Data Variation: Differ in lighting, location, orientation, scale, occlusion, weather, etc.

Data set click here.
EXPERIMENT
We use a hugging face model to recognize different bike images to assess the ideal conditions for Scan Cars to capture image data on the streets. 

In groups of less than 15, the model can often recognize roughly 80% of the bikes, which is a good rate for most uses.
‍
Hugging Face model click here.
CONCLUSION
Weak Points:
1. Be impossible to count all of the bikes in large groups with a missing rate from 10% to 20%.
2. Be unable to identify bikes when the image is blurred.
BEST SOLUTION
The scan car should drive in days slowly at a speed around 10-15 mph . The camera should be placed on both sides of the car to ensure that photos are taken from the back or front of bikes on the street.
TRAINING & TESTING
To train the model, 108 photos with varying lighting conditions and angles were used (52 for "bikes in racks," 26 for "bikes not in racks," and 30 for "empty racks"). To supply the model with a broad data set, images of several types of bike racks were employed. 

Also, this model performs better than the Hugging Face model at correctly identifying and classifying photos with extreme blur, which can aid with the Hugging Face model.
Teachable Machine click here.
RESULTS
The model was validated using 48 photos that were not part of the data set. Ten of these photos were erroneously classified (a success rate of 79.2%).
FINAL RESULTS
The Hugging Face and Teachable Machine models can be combined in an application to first identify overcrowded or underutilized bike parking places, and then roughly count how many bikes are properly or illegally parked to assist municipalities in tracking progress and making iteration plans.
TRAINING OF RECOGNIZATION MODEL
CONCLUSION
Best Conditions:
CODE PROCESSING
We created code to quickly see the outcome of vehicle recognition and counting on a few folders of images. After that, we checked the correctness of the result within the Replit program by opening the files directly from the console.

Code click here.
MODEL EXPERIMENT FOR COUNTING
Test and update with your clients as early as possible
Before beginning design, it is best to clarify and explain the client's requirements to avoid disagreements when the design draft is completed. At the same time, requirements may change from time to time, thus keeping up to date and communicating is essential.
Machine learning techniques make our design more useful
Throughout Machine Learning for Design, I discovered the efficiency and power of machine learning techniques like Computer Vision and Natural Language Processing. I wish to dig more into artificial intelligence because this can broaden my possibilities in UX Design and Research
MY TAKEAWAY
Previous
HelloScraps
Next
IKEA Curtain Design Tool