The San Francisco 311 App's purpose is to be a 311 service in your pocket that can be used with ease. Although it functions how it should (mostly), there are some aspects of the app that can be improved that I noticed while using the 311 app. The app looks like it was designed once and never updated. Overall, it looks outdated and unattractive.
My goal was to bring the app a new, less static vibe. I wanted to redesign to represent San Francisco properly, while making the app more visually oriented and easier to use
Home Screen
The original home screen for the app does not catch my eye. As the first sceen of the app, it should catch the users eye. This screen is going to set the tone for the whole app so it should grab the users attention. The existing screen for the app looks very outdated. Not only is the design outdated, but the page looks very static, like it has not been updated in a long time.
For the redesign, I wanted the page to have more movement. I created new icons, gave them their own column on the left and created an "SF Today" section. "SF Today" gives updates, alerts and news. It also connects you to SF social media. I also added a bacjground image that represents San Francisco, because the skyline on the previous design is outdated and does not represesnt the city very well.
Choose Service
The original "Choose Service" screen is hard to navigate. It lacks color and any sort of visual aid or hierarchy. The lack or any visual aid on this screen makes the choose service process longer than it should be. I wanted to figure out a way to make this process faster.
The redesigned screen now has icons to aid the user. I divided the services into sections and have icons to represent the service and text below it to confirm what the service is. Now, all of the services fit on the creen without having to scroll down. They also have visual aid to help users find them faster.
Description
The description screen lacks any design at all. Not only that, but it does not do a good job of explaining how to submit a proper description. One aspect of the screen that I find uneccesary is the options opening different screens. For example, when it asks for a description, instead of having a text box with a pop-up keyboard, it takes you to a new screen.
On the redesign, I made the page more pleasing to the eye. I added a background showing off downtown San Francisco to match the home screen as well as bringing an SF theme to it. For the description, I put an example description in the text box in order to improve the users' descriptions which will then improve the experience on both sides. I also added some other aspects that I think are important in the description process, such as; "How Urgent?" "Reoccuring Problem?" and "Have You Requested Before?". These options will make it easier for 311 to put priority on some issues.
Service Directory
The Service Directory on the app takes you to a webpage. This screen should be included inside the app for ease of use and consistency. I find that when pages are linked to outside sources and apps lack consistency within themselves it can be frustrating. In this case, the page does not fit to the screen well or use the space properly. In the space provided, only half is used and the text boxes and buttons are extremely small. If it had been formatted correctly, they would have larger sections to type and use up the whole screen.
On the redesign I decided to go with a different concept, a map. I thought a visual aid would better suit the Service directory. For my idea, you pick a service, and for each service they have a map of San Francisco, locating the services for you. When clicked on, it provides you with the name, number and specific location or the service. This map allows you to find the service closest to you without having to go through a list.
