FRONT END WEB DEVELOPMENT

University Course, 2023.

BRIEF
To design and author code from scratch for a static website for the ANU Graduate Showcase. Ensure design and code is responsive, accounting for different screen sizes. Employ user interface and web design best practices to consider typography, layout, visual aesthetics, interface behaviours, and information architecture.

LANGUAGES & TOOLS
HTML, CSS, Visual Studio Code, Adobe XD.

DESKTOP VIEW CLICK-THROUGH:

MOBILE CLICK-THROUGH

PROCESS

Information architecture mapping:

Logo design:
A logo helped give the site a visual identity.

Low-fidelity Wireframing:

High-fidelity Wireflows:

A mobile-first approach ensured the design would be highly effective for phones, which are the most commonly used devices for browsing the internet.

Visual Studio Code:

Over 1200 lines of CSS were written from scratch to style the HTML for the website.