So now the Beerbiceps Site is Finished let's see how it took me longer than usual, started on September 7th
.gif)
.jpeg)
Who is Beerbiceps?
BeerBiceps Pvt Ltd, a company that creates self-improvement content in various formats (7 Million+ online followers/subscribers) & has co-founded Monk Entertainment (Monk-E), a 50 member organization that provides content marketing & digital marketing solutions of all kinds.
Requirements
Charmi Sanghvi (Creative Head) from Beerbiceps emailed me about it
- Blog Website
- Wordpress
- Custom UI
- Wants newsletter + ebook to be sent on email input
- Something like adesignguy.co video in background carousel interesting landing page.
Steps
- Discuss commercials and timeline
- Discuss more on timelines (cause you know changes hehe)
- Wireframing
- Moodboard i.e knowing what your client wants be it color dark theme? or even pics which makes them happy
Starting off
- Move blogs db posts from beerbiceps.com to beerbiceps2.adesignguy.co
- Setup basic Github pipeline with my account
- Start a wireframe on figma
- Finish the wireframe in 1 week
- Shared the wireframe and started sending samples from 10th September
After finalising the loader this is the GIF I made will link the PSD file later for reference if anyone wants to know how it's made.
Setting up themes cutting images and all was done with the help of my Younger Brother he does basic Photoshop so they are attached below
.gif)
Blog website layout templating got over by 29th September 2020
But instead, there was a massive change to just remove the blogs and stuff and just start with a "Full-Jhatak" Ranveer showcasing him and everything.
How to go about it?
Wireframe on piece of paper
ask for a Figma/XD/Sketch file
Start from Scratch
Although, it's a custom design I made it on WordPress itself so as to manage the blocks and everything it'd be easy for their team to make certain changes be it a link or a Logo change and stuff it's so easy that it can be done using a phone as well.
- Voila! The website is ready. First off it was
— beerbiceps2.adesignguy.co
— Then v1. v2. v3. v4. v5 🙃
v3.beerbiceps.com is still up and is a Blog Website
v5.beerbiceps.com is the one which is to be used live.
What else did I make?
- I made a flutter app which fetched blogs using GraphQL.
.gif)
- Also made a whole different m.beeerbiceps.com experience just as to how Facebook does when it's a mobile site it opens m.facebook.com so it was on ReactJS same Blog Fetch using Apollo
- Made an amazing kickass video to showcase 😉
.jpg)
- It's also a PWA.