UX Architecture Reconstruction of Web and Mobile
How to Keep a Customer though UX Design and Development
Before jumping into editing Bloomington Tutor’s blog, I first had to assess what key components they had and what they needed to utilize better. I came across many UX flaws that had a significant detriment on keeping users on their website. Firstly, their design was not responsive from desktop to mobile in a logical way. Their pagination was also dull and unhelpful, and the article results themselves had the problem of having few keywords related to an obvious course or subject. Another major problem was that their sidebar was too long to sift through in order to find important information. All of these errors prevented traffic getting to and staying on their blog.
Once I surveyed the website and analyzed potential users of the program through their backend analytics, I began a high fidelity mockup in Adobe Illustrator of what the website could look like. I included a link in the header on each page that would lead the user to the main blog landing page. I also implemented a search bar at the top of the screen that would be available in both cellular and mobile, with dropdown menu included. This search bar would be very important in finding information, so I decided to implement selections that would be visible at the top of the page. Within the page itself, each article type (there were multiple classes) would have a distinct icon and label that would be placed at the beginning of each article preview. Finally, I moved pagination to the bottom of the screen to form a more logical flow of information.
Once my design was approved, I worked with the owners of the website to create as close as possible to their desired outcome using their open source software (Grav). As you can see, the icon and title info appear automatically at each post’s publishing. The design is also consistent throughout platforms, and articles fade in on soft scroll. Most importantly, the search system is organized for easy comprehension.
I learned a lot from this project, and I especially realized how iterative the process of both design and development are in web environments. Because of this I am better prepared for a future project that may need proper UX architecture and design implementation.