top of page

GREENWOOD APP: CLIENT

portfolio image.png
CLIENT

The Greenwood Network is a platform that aims to increase exposure for black-owned business while directing customers to the consistent quality of product and services provided by the Black community.

BRIEF

 

Create a single web page design for both desktop and mobile that will include the site branding with a clear and compelling CTA (call to action) which would encourage users to subscribing to the Greenwood mailing list.

  • This page must display all of the about us information

  • An element of it must be purposed to display a product timeline

  • the page sections blocks must be clear and distinct for accessibility reasons

  • Must comply with the legibility rules following web standards

Create an email template that will be used as the background for the Greenwood App newsletter.

 

 

GOALS

  • The purpose of the web page is to inform potential user-base what Greenwood is.

  • To provide interested individuals with the opportunity to stay up to date with Greenwood.

  • To give business/service/brand owners that would be interested in having their product listed the chance to show interest.

WIREFRAMES AND PROTOTYPES

 

The first thing I wanted to start wireframing was the mobile version of the landing/about/sign up page. The fact is, Greenwood's customer base are Millennials and many of them view sites on their phones rather than screens so this made sense to me. However, upon reflection I decided to design for web first as it's easier (in my opinion) to design a web page first and then alter said page to suit mobile. My wireframe was fairly simple, which was to essentially have elements of the logo fade onto the page, a brief summary text underneath and a large call to action (CTA) at the bottom of the page.

PHOTO-2020-09-09-19-28-15.jpg

When I opened XD I came up with 3 concepts:

 

 

(1)

 

This first design, I wanted to try a colour-block design using Greenwood's colour palette as I thought a single colour would look too simple. 

Web 1920 – 1.png

(2)

 

My client sent me a longer text for the page as a result I went for making use of the vertical instead of keeping the page landscape. This would therefore translate better when creating the mobile version of the page. I continued to play around with colour blocking and added a third colour from Greenwood's palette. 

Web 1920 – 2.png

(3)

With my third concept, rather than only sticking to solid colours like I did in the first two designs, I decided to try something different and go with imagery of green woods as a play on the name "Greenwood" as a background image.

I split the text into three blocks because the information describes the past, present and future of the name and company, Greenwood. 

 

I continued with my colour blocking concept. and have the call to action further up top as this would translate better when it's time to create the mobile template. I did this because my clients were keen to have quite a bit of text and I wanted the CTA to be one of the first things they see after the brand logo incase potential customers do not read until the end. This way they would have at least seen the opportunity to sign up for the newsletter straight away. 

Web 1920 – 3.png
THE PRODUCTS

 

In the end my clients loved the idea of having a background image. We decided to make use of the vertical rather than keeping all of the information on one static page, and we made room for a production timeline underneath so that their customer base can see where they are with the development of their full website. Using the vertical meant the content would translate better for mobile and it would have a greater consistency between the two platforms.

381e43_8ca453c0b0dc4884b677ec58a9e8b0b9~

I didn't have any changes or revisions to make with the Newsletter design. This was in fact one of my initial designs for the main page however when I had finished creating it, it felt more like a newsletter and so I presented it as such and my clients were very happy with the outcome. I wanted to try using shapes for variety and I added the same wood image from the landing page, inside the circles for consistency with the chosen landing page.

 

My designs are currently with the developers and will be going live this month.

GREENWOOD NEWSLETTER.png
CLIENT FEEDBACK

 

"I think they're great. I love the vibe and the incorporation of the actual 'woods' ... this looks good and professional"

~ Greenwood Network Founders

bottom of page