CodeNewbie Community

loading...

Working With My First Client - Day 2

Alex Vong
I am an aspiring Web Developer, Disney nerd, sports junkie, movie critic, coffee drinker, and tech enthusiast. Oh and I write about them.
Originally published at alexvong.substack.com ・3 min read

Day 1 of research went by pretty quickly. Before I knew it, Day 2 crept its way up and made its presence known. My fellow classmates were off working on their own client websites and we had t-minus three working days to finish the website for the client and time was ticking away. I was feeling anxious as well as excited!

The goal of Day 2 was to plan a strategy and get feedback from the team. Since it was our first time dealing with clients and a project of this magnitude, our mentor, Derek, provided us with a game plan and checklist to help us along. We were advised to take the backstory and research we had so far and turn them into a visual representation to show the client. It could be in the form of mood boards, live HTML wireframes, graphic layouts, etc.

I started Day 2 by recapping all the information I gathered about my client, Intergalactic Plant World, and researched images and themes to create a mood board. I heavily relied on image hosting sites such as Unsplash, Designspiration, Google Images, and Dribble to find the right inspiration and material.

I knew my clients were heavily into psychedelic aesthetics and sold cacti and succulents so I created directions of themes the website can go on my mood board. Most times clients do not want to be given a lot of choices to choose from and make and quite often we, as developers, do not want them making too many decisions anyways. I decided to create my mood board on Affinity designer, a program we have been introduced to and using at Perpetual Education( mobile-view ). On my mood board, I presented two themes the client can choose from.

The first theme (on the left) was heavily focused on psychedelic aesthetics. It was filled with images featuring loud and multi-color combinations and shapes and featured artistic-style plants.

The second theme (on the right) was a nice balance of psychedelic aesthetics and plants. The focus was to show real-life plants that were already colorful in nature and had accessories such as pots and rocks to match the psychedelic theme.

Alt Text

Next, I created a two quick wire-frame layout of my website ideas, also on Affinity Designer, that centered around the two themes. With a visual outline of how I wanted my prototype to look, I created two copies on Codepen to show the client.

Theme 1:
I took that theme and mocked up this prototype on CodePen.
Alt Text

Theme 2:
I also created a prototype for this theme on CodePen.
Alt Text

Both of these prototypes also featured something I have never done before: media queries. My client wanted the website to be fully responsive so I researched how media queries and breakpoints worked and tried to implement them to the best of my abilities in these prototypes.

I ended the day by submitting these prototypes to my classmates as well as to the client for feedback. This concluded Day 2 of working with my first client. Thank you for taking the time to read it and I will continue to post the rest of my experience in future articles!

You can also visit Perpetual Education here:
Desktop Viewers
Mobile Viewers

Discussion (0)