Design System - Brand: Redesign Access the Data Logo

[lrchang2]

Dependency

#129

Overview

As part of the Branding Guide, we need to revamping the Access the Data Logo to reflect our brand's personality.

Additional Information

Brand Personality: Simple, Trustworthy, Empowering, and Friendly

Action Items

Logo must be ADA compliant #26. For logos, color contrast does not matter. It will require the correct alternative text (alt="Company Logo") when rendered.

logo

• Industry research from Comparative Analysis of Websites (different from data sources) and MVP Feature Prioritization  #8 and evaluate competitor logos
  • Consider how to differentiate Access the Data from its "competitors"
• Identify target market and message to target market found in User Personas for Website #27 and User Stories for Website #45
• Determine where the logo will be used
• Review previous versions of the logo and determine if and how it communicates the brand personality
• Draft up/sketch redesign ideas
  • consider color and Design System - Style Guide: Color Palette  #53
• Get feedback and refine logo design with feedback
• Render finalized logo into a reusable and accessible final format

logo variation: rearranged version of primary logo design that gives brand flexibility to show up consistently and recognizably in different placements

• primary logo (horizontal stack)
• vertical stacked logo
• submark logo
• wordmark logo
• icon logo/favicon

favicon

• Draft up designs of favicon
• test favicon on different versions of the browser
• get feedback and vote on the favicon versions

Resources/Instructions

Where current draft of logo lives: Access the Data Figma: Branding and Logo

Web Content Accessibility Guidelines
Previous versions of the logo

All work for branding guide is condensed in the current draft of guide. Guide also contains Content Template Guide #22 and Front-End Style Guide #40

Example logos:
Hack for LA Engage Project Logo
Hack for LA Engage Usability Logo
100 Automation Project Board
100 Automation Project Board test favicon

Blog about Logo Variations
Wix Blog about logo size
iHeart Media logo variations

[joanna-pham]

@lrchang2 @abryant35

Progress: Almost done creating logos based on designers' feedback; trying to create different variations
Blockers: Artist block
Availability: I have enough time this week before showcasing Wednesday
ETA: By Wednesday
Pictures: Figma file - logo page

[abryant35]

@PazauMoua Please add update using this template (even if you have a pull request)

Progress: "What is the current status of your project? What have you completed and what is left to do?"
Blockers: "Difficulties or errors encountered."
Availability: "How much time will you have this week to work on this issue?"
ETA: "When do you expect this issue to be completed?"
Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) ask for help at your next meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #access-the-data channel.

Thank you! :)

[PazauMoua]

Progress: Digitalizing logo ideas
Blockers:
Availability: By Wednesday 10/06 9pm
ETA: Wednesday 10/06 9pm
Pictures:

[PazauMoua]

Progress: B&W logo concepts drafted - tweaks and color to follow if any of the logos are workable
Blockers:
Availability:
ETA:
Pictures:

I think I went a little too literal but let me know what you guys think

[PazauMoua]

Progress: B&W logo concepts drafted - tweaks and color to follow if any of the logos are workable Blockers: Availability: ETA: Pictures:

I think I went a little too literal but let me know what you guys think

[PazauMoua]

Progress: working on abstract concepts and then doing second round edits (adding color)
Blockers: need to finalize colors
Availability: working on this today (10/14) through weekend (along with color and mood boards
ETA: Tues 10/19 9pm
Pictures:

[PazauMoua]

Progress: Added color
Blockers: need to finalize colors
Availability: working throughout the week
ETA: Thurs 10/28 by 4pm
Pictures:

[lrchang2]

final version of logo

[katelyntn]

Progress: Created different favicon styles, still need to add to browser for mockup
Blockers: Figuring out how to work the mockup
Availability: around 2-4 hours on tues
ETA: by this week
Pictures:

[lrchang2]

reviewed work on favicon and logo during team meeting. suggested solid color for "D" for the logo.
next steps are:

• focus on just the "D" as the icon for the favicon
• applied favicons to browser mockups
• check the contrast of the favicons and logos with the figma able plugin
• consider testing other logo ideas

[lrchang2]

@katelyntn Please add update using this template (even if you have a pull request)

Progress: "What is the current status of your project? What have you completed and what is left to do?"
Blockers: "Difficulties or errors encountered."
Availability: "How much time will you have this week to work on this issue?"
ETA: "When do you expect this issue to be completed?"
Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either:

1. ask for help at your next meeting
2. put a "Status: Help Wanted" label on your issue and pull request
3. put up a request for assistance on the #access-the-data channel.

[katelyntn]

Progress: Designed variation of styles of "D" form for favicon and mockup for each style
Blockers: none, will need team to vote
Availability: 2-3 hrs
ETA: By Thurs meeting
Pictures:

[lrchang2]

team has voted in the figma that favicon#16 looks the best on the browsers.

Katelyn will update the current Access the Data logo with the rounded edges like favicon#16, instead of the straight edges like favicon#6 that it currently has

we have decided to do an usability testing comparing rounded vs straight versions of the logo

[lrchang2]

@katelyntn Please add update using this template (even if you have a pull request)

Progress: "What is the current status of your project? What have you completed and what is left to do?"
Blockers: "Difficulties or errors encountered."
Availability: "How much time will you have this week to work on this issue?"
ETA: "When do you expect this issue to be completed?"
Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either:

1. ask for help at your next meeting
2. put a "Status: Help Wanted" label on your issue and pull request
3. put up a request for assistance on the #access-the-data channel.

[lrchang2]

@katelyntn
Please add update using this template (even if you have a pull request)

Progress: "What is the current status of your project? What have you completed and what is left to do?"
Blockers: "Difficulties or errors encountered."
Availability: "How much time will you have this week to work on this issue?"
ETA: "When do you expect this issue to be completed?"
Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either:

1. ask for help at your next meeting
2. put a "Status: Help Wanted" label on your issue and pull request
3. put up a request for assistance on the #access-the-data channel.

[katelyntn]

Progress: Researched the different vertical logo variations and designed vertical versions. Added favicon.
Blockers:
Availability: 2-3
ETA: Thurs
Pictures:

[lrchang2]

@katelyntn
Please add update using this template (even if you have a pull request)

Progress: "What is the current status of your project? What have you completed and what is left to do?"
Blockers: "Difficulties or errors encountered."
Availability: "How much time will you have this week to work on this issue?"
ETA: "When do you expect this issue to be completed?"
Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either:

1. ask for help at your next meeting
2. put a "Status: Help Wanted" label on your issue and pull request
3. put up a request for assistance on the #access-the-data channel.

[katelyntn]

Progress: Designed all the logo variations. Will present for feedback.
Blockers:
Availability: 2-3 hrs
ETA: By Thurs
Pictures:

[lrchang2]

team finalized the version of the vertical, favicon and submark. last step is to create svg, png and jpeg version of each of the logos and put them in the shared drive for team to access and use