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

Complete (and update!) images of each addon #4

Open
17 tasks
Hans5958 opened this issue May 11, 2021 · 161 comments
Open
17 tasks

Complete (and update!) images of each addon #4

Hans5958 opened this issue May 11, 2021 · 161 comments
Assignees
Labels
good first issue Good for newcomers help wanted Extra attention is needed scope: content Related to the contents of the website, excluding blog and docs type: enhancement New feature or request

Comments

@Hans5958
Copy link
Member

Hans5958 commented May 11, 2021

Important

Updates are welcome, and we need it. Some of the focus are...

  1. update them to use the new purple color scheme
  2. redo them with better quality/dimensions.

This is an issue tracking about the addon screenshots. It is mainly displayed on the addons page.

For discussion related to adding images or media to the extension itself, see ScratchAddons/ScratchAddons#364.

You can add your images by following either of these two options.

  1. Create a fork, add your images on /site/assets/images/addons, and create a pull request.
  2. Comment and attach the images on this issue. Someone will add it for you.

Continuation of ScratchAddons/website#61 for website-v2.

Guidelines

The images for the addon are following these rules:

  1. Post the addon ID, and preferably also the addon name. The addon ID is colored gray underneath the addon name.
  2. The image has an extension/a format of .png.
  3. The image has an aspect ratio of 4:3 and a size of at least 400x300.

Note

The recommended sizes are 800x600 to 1200x900, depending of the size of the subject, and the display pixel ratio (DPI) of 3 to 4. Other sizes are still allowed, as long as the ratio is still 4:3 or 1.3333... (e.g. 400x300, 480x360, 800x600).

Zooming in/out using the browser is permitted, including setting the display pixel ratio using browser tools. See this comment as a suggestion.

  1. The image contains a sample of what the addon can offer without any other effects from other addons.

Note

Disable other addons so that the screenshot only shows one addon only. One addon for one image! We don't want confusion.

  1. The image has minimum edits, but still made the image to be not awkward.

Note

If an edit can be made to improve the visibility of addon behaviors, you may do it, while still keep in in the minimum. This includes...

  1. Have additional markers (red cross for removed elements, circle for very, very subtle changes, etc (example from disable-auto-save)
  2. Make a side by side comparison if needed. (example from fix-uploaded-svgs)

If possible, the image is only cropped, without any resizing or other edits. As mentioned, zooming is allowed.

  1. If possible, avoid having user-generated content on the image (user avatars, user names, project thumbnails, project name, etc)

Note

In cases when the editor is needed, but the address bar would be in frame, using https://scratch.mit.edu/projects/editor/ is suggested.

Progress

Missing Addons (3)

Addons that have never gotten an image.

  • collapse-footer
  • paint-skew
  • place-backpack-code-at-cursor

Improve (1)

Has other addons in the background that lose the addon's focus, or is otherwise a bad quality image

  • disable-auto-save (The cat doesn't need to be there)

Outdated (3)

New updates have occurred to this addon that makes it look or act differently.

Hard to Display (9)

Not a priority. You can probably ignore this section, unless you found a way to make this displayable.

@Hans5958
Copy link
Member Author

@TheColaber

Could you resend ScratchAddons/website#61 (comment) but also with the names (id is better)?

@Hans5958 Hans5958 added the help wanted Extra attention is needed label May 11, 2021
@Hans5958 Hans5958 pinned this issue May 11, 2021
@TheColaber

This comment was marked as outdated.

@TheColaber
Copy link
Member

Images

blocks2image:
image
custom-zoom:
image
dango-rain:
image
full-signature:
image
media-recorder:
image
hide-flyout:
image
more-links:
image
last-edit-tooltip:
image

@cobaltt7
Copy link
Contributor

cobaltt7 commented May 11, 2021 via email

@Hans5958
Copy link
Member Author

@RedGuy12

Can you show dango-rain without dark-www and blocks2image without editor-devtools?

Don't worry about it. It's fine for now. @TheColaber, in case you changed it, please tell me.

@TheColaber
Copy link
Member

Added much more data on the TBD graph

@TheColaber
Copy link
Member

More Images

remove-curved-stage-border:
image
gamepad:
image
load-extensions:
image
material-forum-editor-buttons:
image
bitmap-copy:
image
my-ocular:
image
initialise-sprite-position:
image

@mxmou
Copy link
Member

mxmou commented May 20, 2021

I don't think there should be an image for bitmap-copy because it doesn't have any UI at all - unless it shows a bitmap costume next to the copied one in Windows clipboard history or something like that.

@Hans5958 Hans5958 added good first issue Good for newcomers type: enhancement New feature or request labels Jun 11, 2021
@Hans5958 Hans5958 added the scope: content Related to the contents of the website, excluding blog and docs label Jun 30, 2021
@CST1229
Copy link
Member

CST1229 commented Jul 2, 2021

Image for expanding-search-bar

Could be better by using a different search term (or none at all, but I think having something in the search bar would be the best way to illustrate this addon).
Also could be taken on Chrome.

@Hans5958
Copy link
Member Author

Hans5958 commented Jul 2, 2021

Also could be taken on Chrome.

It's fine to use other than Chrome. You can also crop the address bar if you want to. Either way, I will add yours later.

@CST1229
Copy link
Member

CST1229 commented Jul 2, 2021

Also could be taken on Chrome.

It's fine to use other than Chrome. You can also crop the address bar if you want to. Either way, I will add yours later.

I feel cropping out the address bar and leaving the navbar at the very top would somewhat distract you from the search bar.

@iqnite
Copy link

iqnite commented Jul 12, 2021

debugger
image

@iqnite
Copy link

iqnite commented Jul 12, 2021

expanding-search-bar
image

@iqnite
Copy link

iqnite commented Jul 12, 2021

message-filters
image

@iqnite
Copy link

iqnite commented Jul 12, 2021

material-forum-editor-buttons
image

@iqnite
Copy link

iqnite commented Jul 12, 2021

gamepad
image

@iqnite
Copy link

iqnite commented Jul 12, 2021

remove-curved-stage-border
image

@mxmou
Copy link
Member

mxmou commented Jul 12, 2021

@iqnite Please crop screenshots to 400x300.

@iqnite
Copy link

iqnite commented Jul 12, 2021

transparent-orphans
image

@cobaltt7
Copy link
Contributor

cobaltt7 commented Jul 12, 2021 via email

@Hans5958
Copy link
Member Author

Hans5958 commented Jul 12, 2021

@iqnite

  1. Crop/resize those images to 400x300.
  2. Avoid other changes from other addons. I just revised rule number 4.
  3. I'm still going with @CST1229's for expanding-search-bar.

Also, to whom it may concern, let's just do not hide the messages. It is fine for now.

@mxmou
Copy link
Member

mxmou commented Jul 12, 2021

Some updated images:

Cat blocks
Studio tools
Exact count

@CST1229
Copy link
Member

CST1229 commented Jul 12, 2021

Updated image for editor-stepping (with the improved highlight):
editor-stepping

@iqnite
Copy link

iqnite commented Jan 18, 2023

image

vol-slider

@Hans5958
Copy link
Member Author

Hans5958 commented Jan 22, 2023

Before I merge things, I just revised the rule to try keep the dimensions round, like 400x300, 440x330, 480x360, 520x390, etc, in response of there are some dimensions such as 537x403. I have to adjust some of it, so it takes time, but if you guys want to do it yourself, then go ahead.

@iqnite I saw both dark mode and pause button there. Keep in one addon per image, please. I perhaps going to use @Jazza-231's on this one.

Hans5958 added a commit that referenced this issue Feb 4, 2023
CST1229: zebra-stripping
DNin01: disable-paste-offset
Jazza-231: rename-broadcast, jump-to-def, vol-slider

Related: #4

Co-authored-by: DNin01 <[email protected]>
Co-authored-by: Jazza-231 <[email protected]>
Co-authored-by: CST1229 <[email protected]>
Hans5958 added a commit that referenced this issue Feb 4, 2023
@Hans5958
Copy link
Member Author

Hans5958 commented Feb 4, 2023

Finally got time to push the submitted images. The other ones that I didn't upload is either I don't satisfied with them, or I prefer the ones that are done on #245.

I chose CST's zebra-stripping for better clarity, as I feel having all of the possible variations would be too much for general readers.

I chose CST's no-script-bumping. While it may too much for some, I think DNin01's version would still unclear for me to be obvious enough. While CST is also not absolutely obvious, I say that it is slightly better than the latter.

I haven't included paint-snap as I'm not sure if it is how it looks (haven't checked it). LMK if this is how the release looked.

Also on the same round is I remaster some of the images: e2964db. I did this with screenshot tool on the developer tools. I use the DPS of 4, except when the image exceeds 1600 x 1200 (4x of 400x300), in which I fallback to the DPS of 3. In case of anyone wanted to do it as I do, you can check how to take these screenshots with the DPS you want by following the guide on these links.

As a final note, I have edited the guidelines slightly so it is more clear. Probably one important thing to point out is the fifth one: "Keep edits in minimum, while trying to make it so it isn't awkward."

@CST1229
Copy link
Member

CST1229 commented Feb 4, 2023

number-pad

@mybearworld
Copy link
Contributor

middle-click-popup

paint-snap (The one that has been commented here is an old version)

opacity-slider

message-filters (Shows everything instead of only a part)

@mybearworld
Copy link
Contributor

mybearworld commented Apr 15, 2023

pick-colors-from-stage

share-through-mystuff

sprite-properties

hide-project-stats (updated)

expanded-backpack

@Samq64
Copy link
Member

Samq64 commented Apr 15, 2023

The grey check boxes make it look like they're disabled. That's probably just a browser thing though.

Could the block related addons be disabled in that screenshot?

@mybearworld
Copy link
Contributor

mybearworld commented Apr 15, 2023

The grey check boxes make it look like they're disabled. That's probably just a browser thing though.

It is.

Could the block related addons be disabled in that screenshot?

I'll do that.

@mybearworld
Copy link
Contributor

Could the block related addons be disabled in that screenshot?

Changed!

@mybearworld
Copy link
Contributor

mybearworld commented Aug 19, 2023

forum-post-cooldown

cooldown

@Hans5958 Hans5958 changed the title Complete images of each addon Complete (and update!) images of each addon Sep 28, 2023
@Hans5958
Copy link
Member Author

Hans5958 commented Sep 28, 2023

Original post have been edited to reflect the current status, as well as merging the progress message for better visibility (both so it is not hidden, and for the 9 to 23 tasks indicator).

@Samq64 Samq64 closed this as completed Sep 28, 2023
@Samq64
Copy link
Member

Samq64 commented Sep 28, 2023

Sorry, missed-clicked

@Hans5958
Copy link
Member Author

Hans5958 commented Apr 11, 2024

Added the recommended sizes of 800x600 to 1200x900, although making it smaller and bigger would be fine.

@Samq64
Copy link
Member

Samq64 commented Sep 6, 2024

I think the current original post is overwhelming so most people don't bother submitting anything. Could some parts be shortened or put under <details>?

@iqnite
Copy link

iqnite commented Sep 10, 2024

image

paint-skew

@iqnite
Copy link

iqnite commented Sep 10, 2024

image

mediarecorder

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
good first issue Good for newcomers help wanted Extra attention is needed scope: content Related to the contents of the website, excluding blog and docs type: enhancement New feature or request
Projects
None yet
Development

No branches or pull requests