I really enjoyed redesigning this site, because we had creative freedom to design it how we wanted without having to create new content. As well, it was an interesting experience to work as a group, because each person's skills were highlighted and implemented in different ways. The project was built on Github, and so we learned (the hard way) about merge errors and the importance of file organization. This was very practical experience of how a web design project would be managed in a real business, and introduced me to the complexities of project management which I found very interesting.
We all collaborated to come up with the website design, as well as how responsiveness would effect the layout. From there, we noticed that a majority of the content was similar, leading to our choice to create a card template that would be implemented on all pages. This aided in our own design process, but also for users to develop consistency and create expectations across pages.
From my experience on other projects, I felt comfortable creating the responsive navigation bar. This was important to develop the size of each page and provide a clear way to navigate the site. Once established, we each had different parts to work on and shared our progress throughout in both group meetings and virtually. I was tasked with developing an autoplaying carousel, and adapted an open-source carousel called slick to create this effect.
Once the design of each page was finished, I went through each image and added alternate text, aria-labels, and tab stops to make them keyboard and screen-reader accessible. Then, I checked the text color to make sure the page passed contrast standards. Finally, we ran the pages through aXe, Wave, and W3C Validator to ensure we had used proper semantics and accessibility markers.
Tools & Software:
HTM5/CSS3
Javascript/jQuery
Adobe XD
aXe
Wave
W3C Validation
