Responsive Landing Pages for Marketing Campaigns
Designed and developed two landing pages to promote a new event and an e-book from @loker.programmer.
Overview
- Role: Web Developer Intern
- Problem/Goal: The main goal was to create two separate landing pages for a marketing campaign for @loker.programmer, event and e-book. These pages needed to be visually appealing, responsive, and attract users to register for the event or download the e-book. The design will also need to be consistent with the company's branding materials, including the logo, name, and main color scheme.
Key Features
- Developed two separate Single Page Applications (SPA) using React.js.
- Implemented a consistent and modern design using Material-UI based on the company's branding materials.
- Included specific sections such as a hero section, event details or e-book description, and a call-to-action (CTA) section.
- Make sure the pages are responsive and optimized for performance and SEO.
Tech Stack
- Frontend: React.js
- Styling: CSS, Material-UI
- Design: Figma
- Deployment: Netlify
Development Process
My process began with creating design mockups in Figma to establish a design that is aligned with the company's brand. After receiving approval, I then develop the landing pages as Single Page Applications using React.js, which allowed for interactivity in the page. I used Material-UI for styling to ensure a clean and modern user interface, while still allowing customization to match the brand's color scheme and typography. Finally, both of the sites were deployed using Netlify.
Documentation
Results
The landing pages were successfully launched and received positive feedback from both the team and users. These pages have increased the user engagement, with around 26.32% more users registered for the event and downloaded the e-book compared to previous campaigns.