Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Research on whether to create a template or guide for automation graphics #121

Closed
3 of 4 tasks
NivenPrasad opened this issue Jan 7, 2021 · 16 comments
Closed
3 of 4 tasks
Assignees
Labels
documentation Improvements or additions to documentation

Comments

@NivenPrasad
Copy link
Contributor

NivenPrasad commented Jan 7, 2021

Overview

We need to research whether we need a template or guide for automation graphics.

Action Items

  • Research whether a template is appropriate for automation graphics
  • Research whether a guide is appropriate for automation graphics
  • Review with team
  • Add to _guides folder

Resources/Instructions

@NivenPrasad NivenPrasad added the documentation Improvements or additions to documentation label Jan 7, 2021
@NivenPrasad NivenPrasad added this to the 2 - Standards Creation milestone Jan 7, 2021
@superbunker
Copy link
Contributor

superbunker commented Jan 9, 2021

Suggestion that we allow image submissions but offer project image design as one of our "value ads"

@Olivia-Chiong
Copy link
Member

We have agreed to develop a guide for developers to either create their own logo with best practices or open an issue to get a UI designer to do it for them. @superbunker is going to draft the guide.

@superbunker
Copy link
Contributor

superbunker commented Jan 14, 2021


title: Creating a Good Project Image
description: tips and info if you want to make your own project image
status:
display: true

Creating a Good Project Image

General Design Tips

Your project image works like an advertisement. It needs to be a distinct visual identifier that suggests what the project does.

  • Try to convey a sense of your project at a glance.
  • A few distinct colors and an icon may be all you need.
  • You might not need any text. If you do use it, keep it short and large.

Use Clear Images

Bold, simple images usually work best

  • The project image isn’t very large, and may be seen on small screens.
  • Consider using icons and “flat” art.
  • If using photo, keep it simple. Consider cropping complex images down to a clear compelling detail.

Image Rights and Credits

Only use art and images that you have the rights to re-use

  • Do not use an image that you found in search without identifying the source and use rights.
  • The safest images to use are public domain or CC0. You can do whatever you want with these, without attribution.
  • You can use images licensed to require attribution (eg: CC-BY) as long as you give credit to the artist in your project
  • Don’t use any company or software logos without checking their usage guidelines. (eg: GitHub's logo guidelines ask that you not use their logo in your project images)

How to credit images:

  • It's best practice to credit image sources when possible, even if not required.
  • Your project ReadMe file is the best place to credit your sources.
  • The image credit should contain the following information:
  • Title
  • Creator
  • Linked source
  • License

Resources

Color scheme ideas:

Where to find images

Photgraphs:

Icons:

Image Attribution Guidelines:

@NivenPrasad
Copy link
Contributor Author

Issue for reference: hackforla/knowledgebase-content#105

@superbunker
Copy link
Contributor

Guide drafted, still quite rough. May need to narrow the focus so it doesn't get too long?

@Olivia-Chiong
Copy link
Member

@superbunker will update the header with 3 # and also include a menu for navigation.

@superbunker
Copy link
Contributor

Guide updated—changed formatting, added menu with anchors. Still working on content for image rights/attribution details, and overall design advice.

Question about formatting: for standards and accessibility, should we stick to the heading hierarchy? (eg: only use H3 below an H2)

@superbunker
Copy link
Contributor

Converted to bullet style, reduced the design advice, focused a bit more on "don't get us sued" issues.

@NivenPrasad
Copy link
Contributor Author

Include the following elements:
Title
Link
Content
Used-IN
Artist
Provider
Provider-Link
Image-URL
Alt
Type

From HfLA Website doc

@superbunker
Copy link
Contributor

Added specific to do items to guide... haven't done them yet.
Should have it by Saturday

@superbunker
Copy link
Contributor

superbunker commented Jan 30, 2021

  • Added creative commons requirements for image credits, and established Readme as best spot.
    • More specific H4LA image metadata might not be best for project image containing modified images?)
  • Added image credit guidelines to Resources section
  • Re-arranged sections from general to more specific (design, images, rights/attribution)

@NivenPrasad
Copy link
Contributor Author

NivenPrasad commented Feb 4, 2021

@susantangux can you confirm the Guide for readability/sense from your perspective or otherwise confirm it looks good? Saying limit to callouts/confirmation as the issue has been worked on for a couple of weeks and reviewed once so should be 95% there for MVP purposes.

@susantangux
Copy link

I have reviewed the Image Guide and it looks really good. I have the following comments/suggestions:

  1. Section 1 title suggestion - "Finding Free Images to Avoid Copyright Infringement." The sites listed are all free sites so if people stick to them they'd be fine. I worry if they get non-CC0 images from other sources, they could potentially get into trouble and we'd have to explain the different types of image licenses (editorial use, royalty free use, etc).

  2. Very minor on formatting consistency - Sometimes section sub-titles are underlined and sometimes not

  3. Section 5 Sizing Best Practice - Link at the very end of the guide (Website Image Format for the best SEO) mentioned TinyPNG and TinyJPG for image compression. It may be a good idea to mention them in Section 5 so they're at people's fingertips.

  4. Minor formatting - Section 6 Text On Image: the 3 techniques under this shouldn't be labeled Fix Github icon hackforla/website#7, 8, and 9. Use bullets?

superbunker added a commit that referenced this issue Feb 6, 2021
created file, added content from #121
@Olivia-Chiong Olivia-Chiong mentioned this issue Feb 6, 2021
5 tasks
@susantangux
Copy link

I've reviewed "Creating a Good Project Image" guide and it looks good! My only comment is regarding "How to Credit Images" - current guide lists 4 items for image credit: 1) Title, 2) Creator, 3) Linked Source, and 4) License, but Niven requested adding the following elements also (from HfLA Website doc):

    • Content
    • Used-IN
    • Provider
    • Provider-Link
    • Image-URL
    • Alt
    • Type

@NivenPrasad - Please confirm. Thx!

@NivenPrasad
Copy link
Contributor Author

The list above (Content to Type) was originally included for reference but it was subsequently decided, after further work by @superbunker and then discussion amongst the team, that the final guide didn't need to include those items.

@Olivia-Chiong
Copy link
Member

Changes merged, issue closed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation
Development

No branches or pull requests

4 participants