WDCC Website

Role

- Co Designer
- Frontend Engineer

Industry

- Web Development
- Education

Timeframe

2024, 4 months


Live WebsiteGithub

icon

About

WDCC (Web Development & Consulting Club) is a student-led organisation at the University of Auckland that bridges the gap between academic learning and industry experience.

The club provides students with opportunities to work on real-world projects for real clients, participate in workshops and events, and gain practical experience beyond university.

As both a co-designer and frontend engineer on the project, I was responsible for helping define the visual direction of the redesign while also implementing many of the site's most technically challenging components.

Problem

The existing website no longer reflected the organisation it represented. Originally built when WDCC was significantly smaller, the website had become increasingly disconnected from the club's growth and goals.

Challenge

WDCC sits uniquely in position between a student club and a professional technology organisation. For students, the platform needed to feel approachable, authentic, and inspiring. Visitors should immediately understand that WDCC offered genuine opportunities to learn, build, and gain real-world experience.

For sponsors, industry partners, and university stakeholders, the website needed to demonstrate credibility, activity, and impact.

landing page
navigation page
faq page
event page

Solution

The redesign of the website focused on demonstrating the club's identity through interaction, visual design, and evidence of impact.

Previous projects, upcoming events, workshops, and sponsor relationships became part of the website's experience, providing visitors with clear proof of the opportunities available within the community.

To support this vision, the website incorporated interactive visual experiences and custom 3D elements that reflected the technical creativity of the organisation. These interactions were designed not as decoration, but as a way of communicating the culture of a club built by technologists.

Techonologies

list of tools and technology that made WDCC Website possible

Backend & CMS
Database
3D & Interactive Graphics
Animation & Motion
Cloud & Storage
  • AWS S3 (via Payload Storage)
Tooling & Dev Experience
Build & Deployment

Background Effect Implementation

The background is built using Three.js, a 3D graphics library for the web. A perspective camera defines the viewing space, creating depth and allowing the scene to feel three-dimensional.

The visual effect is composed of hundreds of equilateral triangle geometries randomised in a 3D space. These shapes continuously rotate and spin around the camera, creating a dynamic surrounding motion.

Their positions are calculated using a parametric equation of a circle, which distributes them evenly along a circular path. This gives the effect of the triangles orbiting the viewer.

On the side I've given a simplfied example made on Desmos that you can have a look at.

Open on Desmos
Tulza.dev portoflio © 2026.
NavigationHome