Social-B

This is a landing page for Social'B. Social'B is a digital marketing agency that specializes in digital strategy, community management, and influencer marketing. Social-B fully manages your presence online and helps you establish your community on different platforms such as Facebook, Instagram, Twitter, LinkedIn, Viadeo, YouTube, Pinterest, and many more...

Table of contents

• Overview
  • The challenge
  • Screenshot
  • Links
• Process
  • Built with
  • What I learned
  • Continued development
  • Useful resources
• Author

Overview

The challenge

Users should be able to:

• View the optimal layout depending on their device's screen size
• Navigate the page via a navigation menu
• Interact with interactive elements
  • See hover and focus states for interactive elements
  • Switch between interactive cards
  • Receive validation information while filling out a form

Screenshot

Links

• Repository URL: https://github.com/jeanpierretouma/social-b
• Live Site URL: https://jeanpierretouma.github.io/social-b

Process

Built with

• Semantic HTML5 markup
• Flexbox
• Grid
• jQuery
• Normalize.css
• Animate.css
• Glider.js

What I learned

This project was a gig I worked on and it helped me get a glimpse of what it means to be a frontend developer or a web developer in general. I learned to collaborate with the business owner and ask questions to understand their needs and goals to set a plan to work on the project. I learned about the process of making a website from scratch. While designing and building this project I learned about the different stages that a designer and developer must go through to get to the final product with the best possible outcome that serves the users of the website and the business behind it.

Continued development

I'm satisfied with the way I designed and built this project because it was my first gig and the client was happy with the end result. It looks quite close to the design which tackles all users' challenges and it works well.

In the future I'll implement JS form validation to increase the security and usability of the contact form.

Useful resources

• A Complete Guide to Grid - This article helped me understand the different ways to build a layout with CSS Grid. I'd recommend it to people looking for different use cases of CSS Grid.

Author

The content and design are copyrighted by the business owner of Social-B - PLAYTAG at playtag.ai. I was given permission to display this project on my GitHub profile as a portfolio.