I had my first course and introduction to the basic principles of digital and web design. We studied web typography, responsive design, accessibility, and UI animation. Over the course, we put together a website mockup in both desktop and mobile versions.
Creative Brief
We started with a simple, self-imagined design brief
- Design problem: Help users find things to do locally.
- Audience: Young adults & adults – with and without pets and/or kids.
- Website Features: Interests, calendar, food & drink, music, pet/kid friendly activities, shopping, local guide…
- User Goals: Find fun & interesting things to do locally and learn about their town; have fun, meet with friends, meet new friends.
- Brand Attributes: cultured, adventurous, exciting, fun, entertaining, friendly…
Sketches
With this information, I went to the internet to conduct a little design research on similar websites and created several sketches
Mockups
After studying the brief and research, I chose one of my sketches that I felt would be the best fit and went to work in Adobe XD, creating a mockup home page for my imaginary website for both desktop and mobile versions. After being given student feedback, here is the final result:
CodePen
We also got an introduction into CSS and using CSS grids as well as Flexbox and how each of these CSS systems work with HTML.