I’ve always wondered how developers create cell phone applications and think about an application that the world needs to have developed. The app Visit NBMA seeks to provide information for visitors and residents of New Bedford, Massachusetts.
Currently, the city does not have a cell phone application, and
the city’s poor website informed the decision to develop an application that could better tell the story of New Bedford, including the restaurants, businesses, shops, galleries, artists, and more.
The process included:
- Mind-mapping cell phone application purposes
- Analyzing the information architecture of New Bedford’s website
- Developing information architecture of an application
- Creating a paper prototype
- Gathering feedback from usability testing
- Refining the application’s design
- Finally, developing a high-fidelity prototype.
Adobe XD
I’m so excited to share that a high-fidelity prototype exists! I chose Adobe XD to develop this prototype. I haven’t used Adobe XD before, and within an hour, I felt completely comfortable with the program. I’m impressed. Adobe knocked it out of the park with this program.
The program is intuitive, easy to understand, and extremely powerful. The software also allows real-time monitoring and testing on an actual device. With my iPhone X ready, the prototype began to feel and look like an existing application.
Adobe XD made linking and coding the behaviors of the application reasonably straightforward. I’m grateful for the software’s click-and-connect approach. I’ve never made an application prototype before and found the connection process to be a breeze.
I also wish I could simply export this project and have a fully functional app to simply upload to the Apple App Store. However, I understand and respect the complexity of back-end development. I can only imagine how much easier app development will be as technology advances continually.
Visit NBMA: Prototype
Try and experiment with the working prototype above.
The Prototype Process
I developed a series of screens, templated the visual elements and layout, and began capturing photography of New Bedford. Luckily the weather cooperated and captured the images needed for the app. It also helped that I have developed an extensive photo library of The Whaling City.
I wanted the app to be easy to navigate and operate light on text. I envisioned the images to ease the user experience in a media immersive app.
The prototype features five main header pages, subheaders, sample paths to core content, a navigational flyout menu, and a mocked-up search panel.
‘Visit NBMA’ demonstrates its usefulness with events, businesses, restaurants, mural locations, maps, and links to websites and allows users to integrate the application with geo-location and personal calendars.
Prototyping Improves User Experience.
Developing a high-fidelity prototype offered me many changes that improved the usability and user experience of ‘Visit NBMA.’ The prototyping process allowed me to experience the app firsthand and gave me critical insight into how the app should respond.
I realized I needed to develop a ‘back button on my subheader pages. This added button allows users to navigate to the main pages easily. I also found it essential to create a fixed header element that did not scroll with the screens.
The prototype process also inspired me to adjust the sequence of the main headers, subheaders, and scrollable elements. I also reconfigured the hamburger menu, allowing users to learn about COVID 19, and giving users the ability to find New Bedford’s social media platforms. A hamburger menu features all pages instead of the main headers in the paper prototype.
The addition of a search overlay demonstrates how users can quickly locate information.
Personal Reflection
I am not an app developer, and this was my first experience with UX. This process was fascinating, and I’ve learned so much from this project. This project was genuinely exciting.
Information architecture and high fidelity prototyping were the most enjoyable app development process. I found structuring information fully rewarding and felt satisfied once information became organized.
I’m surprised to see how poorly designed many websites and applications are. My curiosity piques, challenging the status quo of web development.
Often I found myself creating a screen and immediately testing the design. Frequent testing allowed me to clean up the design and insight into how an application would work. I also found having a usability testing session invaluable in app development. The feedback promoted a more robust design and forced me to confront my app’s weaknesses.
Overall, this project inspired me to rethink the app development process and bolstered my confidence in UX.
I’m incredibly proud of this project and would love to pitch it to the city of New Bedford. I’d love to see it fully developed and in the hands of visitors and residents of The Whaling City.
Need Help Prototyping Your Cell Phone Application?
I’m here to help you develop a working prototype of your cell phone application!
