Hometown Website
Brief: Design and prototype a website for your hometown, village, city, etc. D
Design and prototyping will feature Figma, using variants, hover effects, and page transitions to create a video demonstration of their website design.
The design process requires research, competitive analysis, site maps, user personas, and mid-fidelity wireframes for full marks.
Software USed
Adobe Illustrator
Figma
Color & Type
#F4F4F4
#000000
#FFBA49
#305EAB
#90ADE0
The new color choices lean heavier into blue using the yellow/gold only as an accent. The middle blue is sampled directly from the “Alden A” logo, with a royal blue for the main color and a consistent lighter tint for specific uses.
Currently, there are 3 different practically identical fonts in use on their website, all of which are very similar. The main one is Inter; a variable-weight font based on Helvetica. Along with Inter, there is Helvetica itself as well as Arial, another font based on Helvetica. To simplify this without diverging from the current choice I’ll simplify the type down to Helvetica Neue, a modern variation of Helvetica that is a little easier on the eyes, with softer edges.
#02296C
The school’s website is/was set as the default tab when opening a new browser window on all of the lab computers, making it not only a source for school resources but also a home page that served as a link hub for various activities both during class and after school activities. I wanted to keep this behavior while enhancing it by making the layout more uniform and concise, with any scrolling done being for only extra information.