Sit Conmigo

  1. Sit Conmigo Responsive Web Designred chair
  2. What type of project did you create? What was the scope (i.e., deliverables)?
    Hint: The type of project can be a website, brochure, email campaign, or brand identity. Your deliverables are the materials you provided your client, like design comps, templates, icons, or logos.

    Type: Digital Wireframe / color scheme / typography / Digital comp

Tools: AdobeXD

 

  1. What image would you like to feature? This can be a mock-up of your project.
    Hint: You can use a tool like GraphicBurger to create a mock-up for free!

    [paste or link image here]

  2.  
  3. What role did you play in the project? Were you responsible for communicating directly with the client?

Lead Web Designer

  1. In 1 paragraph, provide an overview of your project. Describe the project including the design needs you were fulfilling.
    Hint: Don’t forget to mention your client here. Even a fictional client, like Dorothy, is worth noting!

I was hired by Yolanda Lopez CEO, Designer, and owner of Sit Conmigo chair company to design a mobile-first one-page website to showcase her products and take pre-orders of her chairs.

  1. In 1-2 paragraphs, describe the project’s goals. Also, describe the problems you were trying to solve with your design.

    In order to maintain a clean look and organization, I made sure to fit the content into a one-page highlighting Sit Conmigo’s chair gallery, information about Yolanda Lopez, and the mission that makes her chairs so special.

 

  1. In 3-6 paragraphs, detail the design process you took to solve the problem or reach the goals. Also, include images to support your design process narrative.
    Hint: Discuss any design choices you made, like typography, colors, icons, photos, and placement.
     

Design Research

I usually like when I first meet with my client, to complete a questionnaire in order to know more about her goals and understand her needs. This way, we start direct constant contact, working together to achieve our goals. Having this information allows me to design a wireframe as a foundation for her website. 

 

Wireframe sketch

 

I started sketching paper wireframes with mobile-first design in mind.  My priority was to include a large call to action button on the Hero Image on the homepage to attract users to pre-order, as well as display Sit Conmigo’s beautiful chairs with plenty of white space to make the products more attractive to purchase.

 

 

 

Digital Wireframes

 

In AdobeXD I handcrafted each paper wireframe into a digital wireframe for mobile, tablet, and desktop devices. Since is a lo-fi wireframe, no logo, icons, colors, typefaces, or images are used in this stage.  I added Sit Conmigo’s text so that the website can take shape allowing me to determine the amount of space per section. I have included some of Yolanda’s quotes in the hero image and contact section to give it a warm touch and develop a company-customer connection and loyalty.

  1. Color scheme:

The colors that I selected were very bright and contrasting to reflect Yolanda’s brand style which is very eco-friendly, ethical, casual, and bright. I wanted to give Yolanda a creative edge on her brand but also look approachable.

 

Typography: 

       The fonts that I selected look very artistic, elegant, bold, creative, and fun. The page title font is Georgia bold which is a serif font that gives the brand a sophisticated modern look. The font selected for the headings and navigation is Allura to give it a more artistic and warm look, and Tahoma for the body text is a sans-serif easy-to-read font.

 

Digital Comps

When my client and I started this project, after compiling her information and goals, we agreed that we wanted a very friendly experience for our customers. After all, who doesn’t love a good comfy chair to have a conversion with family and friends?

 I added all the design elements and components into my digital comps balancing bright colors with soft hues as backgrounds to compliment the layout and content in all of the different devices used to display this website.

I started by placing the logo and company name as the page title, having the navigation links to the right in the header, presented in a hamburger menu for mobile and tablets a full navigation menu on the desktop. Below it, the hero image I picked is the brightest of all the four chairs, the Red Urbe with a call to action button to entice users to pre-order Sit Conmigo’s beautiful chairs. Then continue with the chair gallery presented against a white background card with rounded corners for a softer look to highlight the colorful chairs. The chair gallery’s background lays against a neutral tone to enhance Sit Conmigo’s unique vibrant designs.

I thought it would be really important to make a special short About section placing a picture of Yolanda Lopez, who is an ethical business visioner, showing her friendly smile and mission statement to create a connection between users with Sit Conmigo.

And lastly, I wanted the contact section to look very welcoming and convincing to make a purchase, so I decided to use a light lime green color as a background, and displayed the logo,  one of Sit Conmigo’s mission statements, the contact information, and social media to follow Sit Conmigo at the left, and an easy to use the contact form at the right, should the customer decides to send an email with a large orange button, again, to attract customers to pre-order, which is one of Yolanda’s priority as per her request.

 

Final Design

  1. In 1-2 paragraphs, recount the challenges you faced and overcame during the design process. Were there any takeaways?
    Hint: Remember, even when explaining problems you may have run into, don’t forget to share how you overcame them. And, say everything with confidence! No need to downplay your abilities and experience. 

During the process of this project, I learned that is very important to research and have very direct close communication with my client about who her competitors are, and the retail websites that are her inspiration for her company website so that I can have a clear understanding about her goals and mission before spending any time on designing her website.

Also, after the first revision with my client, it’s necessary that when some changes need to be done, I implement them right away before continuing with the design so that we are reassured that we’re accomplishing our goals and working more effectively.

  1. In 1-2 paragraphs, describe the conclusion or result of the project. How did your design solve the client’s problems?

I delivered Yolanda Lopez a beautiful modern one-page responsive website for mobile, tablet, and desktop so that she can showcase her beautiful designs and continue to expand Sit Conmigo as a unique, ethical,  fair-labor company with a warm comfy welcoming approach that will invite you to relax and enjoy your conversations on a more eco-friendly humanitarian piece.