Overview
The Information Hub for STEAMConf
The STEAM conference website serves a broad audience of students, educators, researchers, and professionals. It provides key details about speakers, workshops, and exhibitions, serving as a central platform for promoting STEAM education, fostering collaboration, and showcasing innovative educational projects.
My role
I contributed to the design and development of the STEAMConf website across three different editions, helping the organization to communicate the conference’s vision. My role involved analyzing requirements, crafting a cohesive visual identity, and implementing a responsive, modern web solution to fulfill the needs of organizers, attendees, and sponsors.
- Requirements Analysis: Identified the needs of all stakeholders to define the website’s goals and structure.
- Visual Identity Development: Designed a cohesive visual design aligned with the conference’s mission.
- Responsive Design: Ensured the website provided adaptative interaction across devices and screen sizes.
- Web Development: Built the site using open-source tools, with version control and deployment on a modern web platform.
- User Experience Focus: Optimized navigation, layout, and functionality for ease of use and accessibility.
- Content Management: Enabled efficient updates for event schedules, speakers, and sponsor details.
Discovery
The stakeholders needs
Understanding the needs of our stakeholders was crucial for delivering a good website experience to promote engagement, trust, and satisfaction to the users.
- Conference organizers require a website that effectively promotes the event and displays essential information, with the help of user-friendly content management for updates.
- Attendees need intuitive navigation to access schedules, speaker profiles, and registration details easily, ensuring a good user experience.
- Speakers value accurate representation and promotion of their sessions, with clear visibility of their expertise and topics.
- Sponsors seek prominent acknowledgment, with their logos, contributions, and sponsorship benefits displayed strategically across the site.
Defining the roadmap
The top constraint for this project was the time; in two months the project had to be in production. To control the process, I created a structured process to ensure the successful development of the website.
The Objectives
The primary objective is to create a user-friendly, visually engaging website that effectively communicates the conference details, drives registrations and showcases the conference’s mission and sponsors. The website must serve the needs of all stakeholders while ensuring accessibility, performance, and a good user experience.
- The website should provide clear, concise information, including the program, speakers, and logistics.
- Facilitate easy and secure online registration.
- Showcase the conference’s mission, values, and unique content.
- Highlight sponsors and partners to acknowledge their contributions.
- Ensure the website is responsive, accessible, and optimized for various devices.
Strategy
Defining the Information Architecture
I conducted a content audit to identify the key information to include on the website. Then, I defined the logical grouping and prioritization of content and created the structure to ensure easy navigation and intuitive access to essential information.
Sketching the screens
I started with the design strategy by creating wireframes for each screen to structure and visualize its functionality, focusing on intuitive navigation and user-centric design by outlining the placement of key elements ensuring a logical flow of information.
Defining the UI
Inspired by the creative essence of the conference, I created a vibrant and visually captivating layout characterized by vivid imagery, dynamic shapes, and a color palette infused with energetic hues and contrasting tones to create a sense of playfulness and creativity, which combined with a well-structured information architecture provides the users with concise and comprehensive content.
Implementation
From design to code
For the development of the website, I followed the principles of Jamstack architecture (JS, APIs, and Markup) and was focused on creating a dynamic, responsive, and efficient platform. I utilized HTML, CSS, and JS to build the core structure and styling of the site, Hugo for the content management, and a GitLab repo for version control. Finally, the website was hosted on Netlify, providing reliable deployment, continuous integration, and excellent performance across devices.
The solution
The Platform for Exploring STEAMConf
We achieved with the solution an engaging experience for its diverse audience, ensuring easy access to all essential conference information. Designed to be fully responsive, it delivers an optimized experience across devices. With clear navigation and well-structured content, it allows users to quickly find details about speakers, programs, and registration, making the site a central hub for attendees to explore, connect, and engage with the conference.
Key Outcomes
-
The website successfully served as a central information hub for STEAMConf, providing attendees, speakers, and sponsors with access to all event information.
-
The focus on user experience ensured a responsive, accessible, and intuitive platform across all devices.
-
Clear navigation and structured content allowed users to easily find essential details such as programs, speaker profiles, and registration options.
-
A cohesive visual design reinforced the conference’s mission and branding, enhancing the overall experience.