Maham Fatima's Portfolio
CPSC 581-Project 2: New Way to Unlock Phone
About Project
In this project we were instructed to think of 2 novel ways of unlocking a phone. One with touch based and the other utilizing sensors on our phone.
In place of the traditional "slide to unlock", we've introduced two innovative interfaces. The first, a touch-based system, is named the Guitar Hero Lock. The second leveraging sensor technology is dubbed Fish and Chips Lock.
Design 1: Gesture or Multi-Touch Input: Guitar Hero
The Guitar Hero Lock draws its inspiration from the iconic and much-loved game, Guitar Hero.
In this unique locking mechanism, users are presented with three distinct buttons, each colored red, green, or blue, reminiscent of the game's signature color-coded notes.
To successfully unlock their device, users must tap these buttons in a specific sequence, mirroring the rhythm and pattern challenges of the original game.
If the sequence entered is incorrect, the device remains locked, prompting the user to try their hand at the sequence once more.
This not only adds an element of fun to the unlocking process but also provides an additional layer of security, as the correct sequence becomes akin to a musical password.
Image of our lock
Concept Sketches
When we embarked on the journey to create a touch-based lock, our overarching goal was to strike a balance between user interactivity and simplicity. We believed that for a product to be truly embraced by its users, it needed to offer an engaging experience without overwhelming them with complexity. With this philosophy in mind, we delved deep into brainstorming sessions, exploring a myriad of possibilities and potential designs.
From these sessions, ten standout concept sketches emerged, each representing a unique approach and vision for our system. These sketches not only served as a testament to our creative process but also laid the foundational blueprint for the development of our innovative touch-based lock system.
Unlock by tapping a specific rhythm.
Simultaneously touch both sides in pattern.
Solve the maze to unlock
Unlock by tapping a specific rhythm.
After thorough examination and reflection, we've determined that the lock inspired by "Guitar Hero" emerges as the top contender.
Its distinctiveness and captivating interface truly differentiate it. Given the widespread recognition of the Guitar Hero game, many individuals already possess foundational knowledge of how it operates. Its simple rules mean that even those new to the game can easily understand and adapt to its mechanics.
Integrating a gaming theme into the lock's design not only introduces a playful element but also boosts user engagement. This innovative approach elevates a routine action, such as unlocking, into a delightful and interactive experience, heightening its allure for users.
Detail/ Variation Sketches
After finalizing our initial concept sketches, each member of our team took the initiative to further refine and develop their own detailed sketches. This collaborative approach resulted in a collection of ten intricate and well-thought-out designs, each showcasing unique features and functionalities. These sketches were then collectively reviewed and discussed in depth, ensuring that every perspective was taken into account. Our primary criteria for selecting the most suitable sketches were twofold. Firstly, we considered the feasibility of implementing each design into our touch-based system. It was essential for us to ensure that the chosen designs could be realistically transformed into functional features without compromising their integrity or the overall system's performance. Secondly, we evaluated how well each sketch could integrate with others to create a cohesive user experience. Our ultimate goal was to ensure that our touch-based system was not only interactive but also user-friendly and straightforward. By focusing on these criteria, we aimed to strike a balance between innovation and practicality, ensuring that our final product would be both cutting-edge and accessible to our target audience.
Tapping on the circles to create a rhythm
Tap 10 times in a rhythm
Round displayer, this represents the number of the current round.
Tapping on the circles to create a rhythm
From the collection of detailed sketches, we decided to move forward with the final eight designs, excluding the fifth one, to be incorporated as key features of our system.
To prevent accidental initiation, users are required to tap specific buttons on the screen to begin the passcode entry process. We've integrated transparent buttons at the bottom and incorporated the flow of balls, reminiscent of the iconic Guitar Hero game design. This was a deliberate choice to evoke a sense of familiarity among users. Additionally, we've implemented a board that keeps a record of the selected colors, paired with a circular display, to keep users informed about their ongoing progress.
By amalgamating these elements, we've managed to enhance the system's user-friendliness and interactive nature.
Demo Video
Design 2: Using Any Sensor Input: Fish and Ships Lock
Image of our lock
The Fish-and-Ship lock introduces an innovative approach to phone security. Set against a serene ocean backdrop in a soothing shade of blue, users must steer a boat to catch designated fish to unlock their device.
Various fishes appear on the screen, each representing a unique part of the unlocking code. By tilting their phone to the left or right, users can navigate the boat in pursuit of these fishes.
To verify the password, the user should tilt the phone beyond 90 degrees. Successfully capturing the correct sequence of fishes, as predefined by the password, grants access to the phone. However, if the user misses the mark, they'll have another chance to embark on this aquatic quest to unlock their device.
Concept Sketches
When juxtaposed with the touch-based lock, the sensor-based lock presents a distinct set of challenges and opportunities. While it might initially seem more intricate for users to navigate, with meticulous design and user-centric considerations, it holds the potential to be exceptionally convenient and interactive. The inherent nature of sensor-based systems allows for a more immersive experience, bridging the gap between the user and the device in a seamless manner. Understanding the inherent complexities of sensor-based systems, we approached the design process with a blend of caution and creativity. After numerous discussions, we have distilled our ideas into 10 concept sketches. These sketches represent the most promising and innovative solutions, each offering a distinct approach to how sensor-based locks can be integrated into daily life.
Record the hand doing a series of hand symbols level
Shake the phone until the bar fills up to the correct
Rotate phone to enter password
Record the hand doing a series of hand symbols level
Upon thorough deliberation, we've come to the conclusion that the concept of tilting the phone to introduce branches stands out as the most promising. Several reasons underpin this decision. Firstly, the simplicity of the idea ensures that users can quickly grasp the concept without a steep learning curve. The act of tilting the phone is a natural and intuitive motion, which means users are likely to find the experience seamless and fluid. Furthermore, the immediate visual feedback on the interface as branches appear in response to the user's actions enhances the interactive nature of the system. This real-time responsiveness not only makes the system more engaging but also provides users with a sense of control and satisfaction. In a world where user experience is paramount, ensuring that our system is both intuitive and interactive is crucial, and this concept effectively addresses both these aspects.
Detail/ Variation Sketches
tilt the phone to the left or right to add objects
use voice to choose direction to add branches and move it up or down to add fruits
Snap to unlock the phone
tilt the phone to the left or right to add objects
Upon finalizing our decisions regarding the initial concept sketches, every member of our team delved deeper into the design process, crafting their own intricate and detailed sketches. This method not only allowed for a multitude of perspectives but also ensured that we tapped into the collective creativity of our team. Following this, we gathered for a collaborative session where we showcased and discussed these detailed sketches, fostering an environment of constructive feedback and mutual learning. Displayed below are ten of these elaborately designed sketches, each reflecting a unique vision and approach. From this rich tapestry of ideas, we selected specific designs to form the backbone of our system. Our selection criteria were rooted in practicality and synergy. We carefully evaluated the feasibility of implementing each sketch and considered how seamlessly they could integrate with one another. Our primary goal was to ensure that the final system encapsulated the core principles of our sensor-based system: to be both convenient for the user and to offer an interactive experience. Through this rigorous process, we aimed to strike the perfect balance between innovation and usability.
Out of the myriad of detailed sketches we had at our disposal, our team collectively decided to focus on the first and fifth sketches as the primary blueprints for our system's functions. While these sketches originally revolved around a plant theme, we felt a shift was necessary to enhance user interactivity. Thus, we transitioned to a catching fish theme, which we believed would resonate more with users and provide a dynamic experience. In this revamped theme, every time a user tilts their phone, the action doesn't result in the growth of a branch or the appearance of a fruit, as originally conceptualized. Instead, a boat on the screen captures a fish, making the interaction more lively and engaging. Furthermore, we opted for the flipping motion as the method of initiation. This choice was influenced by its similarity to the tilting motion, ensuring a cohesive user experience. While both motions are related, their distinct directions ensure that users can easily differentiate between the two, without accidentally starting entering the password. This design choice ensures that the system remains intuitive, reducing the chances of user confusion while maintaining a seamless and interactive experience.
Demo Video
Contributions:
This project would not be possible without the contribution of every member of our team. Thank you, Surya, Bruce, and Thao for your hard work!
I personally contributed by helping with sketches, idea formation, the design and coding of the interface.
I initially started by pitching ideas and sketching. We went with Surya's Guitar Hero style lock for touch based. We decided on my tree idea for the sensor based and focused on tilting. We changed the idea of our theme to make it more visually appealing and intuitive.
I then helped make variation/detail sketches to further expand on our idea. We changed our design for the sensor based to ocean as we thought it would be more visually appealing than a barren tree.
When we started to move forward with implementation, I focused my attention on the sensor based application. I helped with the code and look of the application. I chose music to enhance the experience and visual effects such as bobbing in the water to make the boat and fish more fun to look at.