The Inner City Museum Repsonsive Website
This is the second design that I worked on as I went through my UX design certificate with Coursera. At this point I was feeling pretty cofident, having made it through my first design process and learning a lot, I was ready and focused to start another project.
Now the prompt I had for this project was to create a responsive website design for a local art museum. Of course, I used a made up art muesum for the actual website but I acted as if it was down the street.
First Steps
The first step I took towards completing this project was of course looking at different examples of museum websites and getting a good feel of how they are designed. I researched smaller museums and bigger museums throughout my state of Virginia just to see how they are set up and how they interact with the user. I found that the smaller museums and the more local in town museums had less complicated designs and hieachries that were easy for users to understand. Because of that finding, that is exactly how why decided to go with a more minamal design. I found that the main elements in each design included featured exhibits, date and times the museums was open, as well as a way to contact the museum if need. After my research was through and I took my various notes needed I began thinking about how I wanted to design the site.
Thoughts on Designing
As I was thinking on designing I took what I learned from my last project and thought about the user journey and exactly what a user would want to do with a musuem website. I concluded that a users main journey would start at the home screen then move to either exibitions or musuem info then possibly check to contact the musuem. So I made sure that I was designing a way for the menu to work in many different paths so that it would be easy for the user to move around wherever they like. With the user in mind, I kept the menu, font, and colors simple. I strove for a minimal designs and used attractive images for the pages. I took the design elements from my research in put that into action in my low fidelity prototype.
For this project, I specifically was prompted to design for bigger screens first, then make a resposive design for mobile as well which is exactly the next step I tackled. The one challenge I ran into while designing for the smaller screens was the fact that I wouldn’t be able to add as much content as the larger screens. However, I still prevailed and was able to make a responsive low fidelity prototype that was just as good as the larger screen version. Here are some links to both of the low fidelity prototypes.
Once I tested my prototypes with five awesome volunteers they all came back with great feedback. A lot of them enjoyed how easy the prototype was to use. They also like the minimal design of it as well. Some of the critiques I got were related to nothing being clickable on the site except for the menu. Of course I also had some users say the site was too simple and boring as well, which makes sense because I just wanted to make the skeleton before we got to the meat and bones. So with that through I began creating the high fidelity prototypes and sythesizing the critiques I recieved and took action in making changes to the designs. I created a more complicated menu but something that still reflects the minimal design I was going for. I also added much more pictures and info to the pages to give the site more life and interest. I added a contact page and made more things clickable on the site for this high fidelity prototype. I started thinking more about color palettes with this design as well, which is something I did not do in my first design for this course. I also worked on making componets for the menu which was a cool skill I learned in this portion of the course. It made the design process a lot easier and faster which was something was really excited about and took with me into the next project as well. With all of that being said here is the high fidelity prototype I created in the after taking my users research into account.
Takeaways and Afterthoughts
Having finished project and being excited to start the next one, I realized that I learned a lot from this project. I’ve grown much quicker in making these designs and a lot of my technical ability in figma has gotten a lot better. I found it easier to sythesize the feedback I got on my work and many of the mistakes that I made on my first project were areas I improved in this project. I also found myself feeling much more confident when designing and found myself even more proud at the end of this project versus the first one. Overall, there is much more I can improve on but this project has shown me that my abilities are improving every day I work on them.