From the outset of the creation of “Mobius,” many questions arose pertaining to its functionality. I contemplated whether this app was to be used as a networking tool like that of Yelp, a utility app similar to Google Maps, or a mixture of both like that of Uber. As a result of these considerations, I deduced that this app wouldn’t require a user profile and that the user’s phone will act as the time-traveling device.
The first crucial step in app design is proper wireframing; as seen in the sketches below, I arranged the position of the necessary elements within the interface. Beginning my design process entailed the manifestation of simple wireframes and needed assets. I broke up each section by its buttons, icons, loaders, copy and menus. Next, I created my style guide which consisted of coherent components. Lastly, I arranged each section such that the app’s flow is logical and easy to navigate.
The main objective in the design of this app was to create a satisfying user experience that is effortless to understand. I focused on the clear labeling of fields, use of visual hierarchy, as well as negative space and contrast of color to identify significant parts of the app. By using familiar interactions and modern design elements, the user can manipulate time with a simple swipe of the clock and input of data. I used icons that users can readily recognize for ease-of-use between different sections of the app.
Upon opening the app, the current time, location and date are at the forefront. The user then has the ability to change all the inputs by tapping the form fields and typing in the location and date. The search functionality can also be accessed by tapping the search icon next to the location field. Once the inputs have been filled out, the BLINK button becomes active, thus allowing for the beginning of time travel. If activated, the BLINK button becomes a timer counting down the estimated time of arrival.
The different sections of the app can be accessed through the menu icon in the upper left or through the tabs at the bottom of the screen.
