LiftLabs app design updates and Upgrades:
Part 2
Continuing to build, modernize, and innovate the LiftLabs mobile app through design,
while working to harness the power of AI
Part 2 project overview
Following the completion of the initial research and design sprint, focus shifted to establishing an even stronger and functional version of the app ready for download from both the App Store and Google Play, as well as real time on water testing with lobster fishers.
This included a variety of aspects, including crucial bug fixes from version 1, the redesign of the user authentication pages, and a wide range of UI and interaction updates aimed to create a more stable, simple, intuitive, and enjoyable app experience.
Bug fixes & performance optimization
The main initial push in phase 2 was identifying and addressing bugs in the current version being launched on the App Store and Google Play. This included enhancing overall app stability and performance across a wide variety of devices through strategic fixes.
Changing pixels to percentage
A common issue identified in several instances stemmed from elements being coded with fixed pixels. Transitioning to a percentage width approach would not only prevents text and images from being cut off, but also allows for a much more adaptable design across a variety of devices.
Getting stuck on the keyboard
A slightly less common but more concerning issue was getting stuck on the keyboard when trying to enter information. In a few cases, the text boxes, buttons and cards would be hidden behind the keyboard completely. This was a fairly simple fix, but required a great deal of testing in the app to create and duplicate the issue to pass on fixes to the devs.
Error states
Lastly, there were a few instances where error states caused caused layout issues (left), contradicting messages (middle), or where an error was displayed when there was actually no error (right). Getting the error states displayed correctly is a crucial part of the overall app as it helps users understand what went wrong and how to solve it, and helps create trust and credibility for the app and business.
Updates to the app's UI
Since the initial sprint and app launch were under such a tight deadline, priority was put on the overall functionality and proof of concept rather than creating a visually stunning design. Having the official stamp of approval on functionality, there is now an opportunity to upgrade the overall look and feel of the app. This was broken down into several sections.
Improving the overall design
-
Simplified and cleaned up the display of information
-
Optimized content organization to better align with workflows
-
Updated the way uneditable states are displayed
-
Added consistent corner radii to elements
-
Reduced stroke size to achieve a more modern look
-
Elevating the overall user experience through UI design refinement
Before
After
Reducing clutter and the need for scrolling
-
Removed uneditable information in edit screens
-
Reorganized and tightened up spacing to reduce scrolling
-
Found better ways to display information to clean up the design
-
Broke up information into a more logical order
Before
After
Enhanced process through interaction design
- Icon animation while retrieving lift to indicate action
- Real-time feedback on distance to lift and countdown for sending range
- Visual feedback when deploying and pinning a lift
Updating the user authentication process
Another important step in the design process was to update the user authentication process (sign-up and log-in) to match the updated design of the app. Being that the original design was created before my joining the project, this was a crucial step to create the best cohesion and first impression possible as user enter the app.
Before
-
Current UI doesn't match the updated app design
-
Can't view hidden password
-
No 'Forgot Password' option in Log In process
-
Next and back buttons hidden by keyboard
After
-
Modern, clean design that matches the rest of the app
-
'Forgot Password' and view password options added
-
Alternate sign-up options available (Gmail, Apple, etc...)
-
Interaction design / app loading incorporated into authentication
Harnessing AI for better insights
As AI experiences continuous growth and expansion, it unveils a distinctive opportunity to acquire invaluable insights and guidance within an industry traditionally marked by uncertainty. The ability to gather essential data from lifts, including depth, water temperature, and currents, offers the potential to contribute to a system that could empower fishers with insights into optimal locations, timing, and techniques for fishing.
Although the integration of AI into the LiftLabs app is still very much in the early stages, there are preliminary approaches that showcase a few potential opportunities within the app. These avenues could pave the way for fishers to spend less time guessing, catch more, earn more, and spend less.
Utilizing data from underwater lifts, combined with future weather predictions, predictive fishing patterns, ecosystem monitoring, and more, to help inform the decision to leave or retrieve traps.
Gathering insights from deployed lifts, along with weather and data on water conditions, depth, and temperature accumulated over the years, to show optimal fishing locations in real time
Next steps
App onboarding
While the app was designed to be fairly simple and may not need an extensive walkthrough, it's still important to provide basic onboarding or possibly short demo for those who may have less experience with technology, or prefer a quicker understanding of the app as they use it for the first time
Finalize tablet buildout
As the phone version of the app moves towards the testing phase, attention can shift towards the tablet design and harnessing the use of "cards" to develop a simple and flexible design. This will be particularly valuable considering the significant increase in screen size while working on a boat in potentially challenging waters, as well as the fact that many fishers will be wearing gloves and simultaneously fishing.
_edited.png)
Usability and on-water app testing
With the basic app developed, and positive feedback from several lobster fishers for the overall design, a major next step is to put it in the hands of lobster fishers for usability and on-water testing to gather direct feedback on layout, functionality, design, and more. This will help inform the next set up next steps as the app continues to grow and evolve.
