I was approached by a member of the ISIJ community who asked me if I could take a look at the current mobile application and make any improvements. They wanted the focus of the user experience to allow the members of the mosque retrieve all the latest information directly from the app through a clean and easy to use UI. By working closely with this member, I updated the UI with their preferences in mind.
My process consisted of 3 main steps. I would first research and analyze the current app, design a solution, then have the design assessed and change it if necessary.
I took a look at the current application to see what things the current app did well and what things it could do better. I was mainly looking for any problems that users may have when attempting to complete tasks. I went through the app and mapped out the user flow to find any pain points that can be simplified.
I noticed that with the current user flow the the user had to click multiple times to accomplish a task. I made note of this and decided that my design would reduce the number of touchpoints that the user had to make to reach their goal.
For reference, this is what the app currently looks like.
To meet my goal of reducing touchpoints, I mapped out a new user flow that allows the users to quickly access the important features and information they usually want.
With the user flow mapped out, I had a clear idea of what components and options should be available to the user on the screens. This streamlined the wireframing process and allowed me to quickly plan out what the screens should look like.
After completing the wireframes and testing them with several potential users, I began to design the high-fidelity screens.
Everything you need, right at the front.
Here you can see daily prayer times, events, and the current fundraiser. Easily access the stream, donate or find the Qibla with a click of a button.
Be kept up to date on all events, ceremonies, and functions that are happening in the community.
A simple and efficient system to donate and support your community.
Find social media, contact information and direct links to your community.
After I completed the wireframes, I sent it to the developer who was going to code the application and asked for any feedback that he might have about the layout, user flow, and general accessibility of the design. With his feedback I made changes to the wireframes and began to work on the high fidelity screens. I then took those high fidelity screens and tested those as well with family, and other designers to find any areas of improvement.
Because of this testing, I was able to improve the the main Homescreen, the News screen, and the More screen.
I had a lot of fun with this project and it also allowed me to do something for my community. I got to experience working with both a client and developer to make sure that my designs were practical. I was also able to improve my design skills and I learnt a lot about what things I should do better for next time.
While neumorphism looks very nice to look at and breathes new life into design, it doesn't really work from a usability point of view. When I tested and showed the final designs to other designers or members of the community, some of them liked the clean look of it but they had trouble figuring out which component meant what.
With my redesign I changed almost every single thing from the original application. Looking back now, I think it might have been a better idea to put more energy in identifying precise pain-points and finding solutions to those pain-points rather than changing everything and beginning from scratch. Sometimes it's worth it to start from scratch, sometimes it's better to fix smaller issues to improve the current user experience.