Screenshot sprint!

We encourage users to post events happening in the community to the community events group on https://www.drupal.org.
heather's picture
Start: 
2011-09-12 09:00 - 2011-09-30 23:55 UTC
Organizers: 
Event type: 
User group meeting

Would you like to improve Drupal.org? Let's do a screenshot sprint!

This is a quick and easy way you can make a direct improvement to Drupal.org, and help out the busy project maintainers, get some good karma, all without a single line of code. The sprint ends on Sept 30th, let's see what kind of impact we can make.

Why a screenshot sprint?

Screenshots illustrate functionality and also to help promote a project. Without screenshots, users may overlook project pages in favor of others. Overall, a lack of screenshots on Drupal.org might make potential users overlook the project entirely.

What are some awesome screenshots?

Most screenshots tend to show in landscape mode. Screenshots can both demonstrate what to expect from the typical configuration ("How can I use this?"), and what kind of output they will end up with in the browser ("What does this project do?").

http://drupal.org/project/admin_menu - Shows the admin menu expanded
Only local images are allowed.

http://drupal.org/project/pathauto - Shows the end results in the address bar as well
Only local images are allowed.

http://drupal.org/project/corolla Shows the theme installed
Only local images are allowed.

http://drupal.org/project/media_youtube - Shows configuration and end result (overlapped, fancy!)
Only local images are allowed.

OK! Let's screenshot!

1. Choose a project.

  • How you choose a project is up to you, it's like a scavenger hunt! Modules, themes and install profiles need your screenshots. You can easily see which ones have thumbnails and which do not on the listings.
  • Consider some of the modules you already use; do they need screenshots?
  • It might make more sense for projects which have some relevant UI configuration screen or themes. Screenshots might not be as useful for utility modules which make no apparent difference to the user.
  • Check the issue queue; did someone else already submit a screenshot?

2. Install the module.

  • Please demonstrate the most recent version of the module, Drupal 7 if available. Put in some sample content, or sample configuration.

3. Create the screenshot(s)!

  • What? In many cases, showing the final result is the best option, rather than configuration screens. If the module makes a change in a configuration screen, (such as permission select) then that is the result. The maintainer can use the images in the project page, as well as documentation.
  • How? Resize your browser window to show the most you can in 700 pixels wide. Show as much as you can in a landscape-formatted image.
    -- Try and crop away all traces of your browser
    -- You can submit larger, but the images will be resized to 700 wide at the maximum.
    -- You can use Skitch, Jing or other screenshot capture program. http://en.wikipedia.org/wiki/Screenshot
  • Where? Upload the file(s) online using your screenshot program, or to your own website, to get a full path like http://example.com/path/to/image.png (since you will likely not be able to submit images on Drupal.org).

4. Submit to issue queue!

Go to the project's page, and click to see the issues for that project.

Are you new to the issue queues? Tips on searching the issue queue: http://drupal.org/node/314182 or Making an issue report: http://drupal.org/node/73179

Example content for the issue

Version: Select [the relevant version]
Component: Select [Documentation]
Category: Select [Task]
Title: Something like "Here's a project page screenshot for you!"
Description: (Leave a quick message. Include the URL to the image.) Example description:

Thanks for the module, I wanted to share this screenshot for your project page. This will help people see what cool stuff your module can do, and make it more likely they'll use it.

http://example.com/path/to/screenshot.png

Issue tag: screenshot

Completed issue
http://drupal.org/node/1278906

Example screenshot

Only local images are allowed.
Uploaded with Skitch!

5. Share!

Share and promote the screenshot you uploaded! Let's see who else can get involved!

6. What's next?

  • Your project maintainer will get notified of your issue. Soon, hopefully they'll get a chance to edit their project page and get your images in there.

How to edit your project page

What else would you like to do?

Join the group if you want to find out more ways you can help improve Drupal.org:
http://groups.drupal.org/drupalorg-improvements

Comments

Link project!

heather's picture

OK! I just did my first contribution on the Link project, adding in a screenshot:
http://drupal.org/node/1275742

A few quick

arianek's picture

A few quick suggestions:

  • http://drupal.org/node/528682 may really help with being able to just add the screenshots yourself rather than having to post issues to get then up (that is if you want to add them to docs pages - obviously project pages can only be edited by maintainers)
  • definitely keep the width to 620px to save the maintainers/docs admins from needing to resize the images
  • try and crop away all traces of your browser, so that you don't see any windows or mac-esque remnants around the outside
  • and if you want to get really fancy, name the image with the version # so that the maintainer can always remind themselves what version it applied to.

Rock on!

Good points about best

heather's picture

Good points about best practices for screenshots. I will include that in the description above and showing the good examples.

Re: new perms on images- Yeah I didn't think "images for all" would make much of a difference, except for being able to attach images to the issue queue. And, hey, we've all got access to some kind of web server space to upload an image file, so. ya know, didn't want to wait much longer. You and I had spoken about this issue in Chicago, and this idea has been sitting around too long in the back of my head. Lisa said "yay" and I said "OK!"

Re: Image size, i noticed that imaged added to project pages are automatically resized- to max width of 700pixels. So it's different than docs, I thought by this, and since the thumbnail is generated, it's not such a bother.

See some examples:
On Permission select: http://drupal.org/node/468658 - also makes the "thumbnail" image.
On Community tags : The thumbnail - http://drupal.org/node/691076?size=thumbnail

Thought we could KISS it. 9I will be glad enough if... even 1 more person joins. Trying to lower the barrier, heh.

Backup and Migrate

karschsp's picture

Added one for Backup and Migrate:

http://drupal.org/node/1279382

Lightbox2

karschsp's picture

Another one for Lightbox2

http://drupal.org/node/1279424

Excellent example

pillarsdotnet's picture

This is an excellent example of a project page that would be greatly improved by the screenshot you submitted.

An awesome initiative! I

aaron's picture

An awesome initiative! I believe that everyone has the possibility to upload images to drupal.org, btw. You should be able to upload them as an attachment to an issue, as karchsp did, or directly to d.o, via http://drupal.org/node/add/image -- you can also display an image in the issue post if you change the filter to Documentation. (I believe everyone has that capability now).

Aaron Winborn
Drupal Multimedia (my book, available now!)
AaronWinborn.com
Advomatic

My input

rickmanelius's picture

Here ya go

http://drupal.org/node/1280602 addressfield
http://drupal.org/node/1280606 mobile_tools
http://drupal.org/node/1280614 context
http://drupal.org/node/1280628 gmap
http://drupal.org/node/1280630 htmlmail

Let's see if they get accepted :)

BTW. It's easier to do a lot at once while you're in the flow. The first took me a while to get my bearings. Then I cranked through the rest in a couple minutes apiece!

I don't understand the focus here.

pillarsdotnet's picture

I've already got screenshots linked from the Resources section of my project page.

Including them on the main project page itself is not user-friendly, as they'll be auto-reduced to thumbnails and stuck at the top of the project page instead of allowing me to place them in the appropriate context.

So rickmanelius wound up submitting a screenshot that is nearly identical to the one I already had posted.

Obviously, this means that adding screenshots to the Screenshots link of the "Resources" section on the project page is non-intuitive, but that's what D.O. project hosting allows.

Maybe you should be contributing to #528682: Allow images to be posted to Drupal.org without any special permissions instead?

Edit:

you can also display an image in the issue post if you change the filter to Documentation. (I believe everyone has that capability now).

Nope; I just checked by editing my documentation page. There is no UI for changing the input format filter. Perhaps aaron is one of the privileged few, but the rest of us don't have that capability. Contribute to #528682 if you want to change that.

Hmm.. trying to understand...

heather's picture

Hmm.. trying to understand... Do you think, in general, we shouldn't have images on project pages at all? Or are you saying they should appear only inline?

Even if the image is a thumbnail, the nice thing is, you can click to see it larger.

I will disagree on that one point about the images. I think having images on project pages (modules and themes) is crucial. This is just a general screenshot for the project, to entice people to try the project, and to give them an idea of what it can do. The project page isn't meant as documentation, per se... but I agree it's best to put images inline for documentation.

And just to say, yes, I was aware of that "images for all" issue when I thought of this sprint. That is a bit of a red herring. See, even if anyone can add images to d.o, they can edit the project page to add the picture. (If anyone is wondering, this shows what you'd see when you're editing the project page http://drupal.org/node/997024 )

Images on project pages

pillarsdotnet's picture

Do you think, in general, we shouldn't have images on project pages at all? Or are you saying they should appear only inline?

What I'm saying is that having an image of (for instance) the module settings page without any kind of textual context is not in any way descriptive or helpful to users who are deciding whether to use my module. I suppose I could photoshop the image and add some explanatory text that way, but then it would only be readable at full-size. There's no convenient way to add context to an image on a project page.

Even if the image is a thumbnail, the nice thing is, you can click to see it larger.

So? I can do the same thing from the images shown on my Screenshots page, and what's better, I can add captions there, and reference them from other documentation pages, and place them in a book hierarchy. I can't do any of that on the project page.

If anyone is wondering, this shows what you'd see when you're editing the project page http://drupal.org/node/997024

Um, no. It doesn't look like what I'd see when I'm editing my project page. At all. This is what I see when I edit my project page:

  • Notice the lack of <img> in the Allowed HTML Tags list.
  • Notice also the lack of any Input format selection.
  • Notice the lack of context surrounding attached images (other than the limited-length, plaintext-only "Image title" field).

I don't think the point of

karschsp's picture

I don't think the point of this initiative is to force project maintainers to include screenshots on their project page, so if you don't think it's useful, mark the issue as "Closed (won't fix)" and link to your comment above for the reasons. I agree that not all project pages would benefit from screenshots, however there are many that would and are currently lacking in that area, and for that reason I believe this initiative is beneificial.

Closed -- Works as Designed

pillarsdotnet's picture

if you don't think it's useful, mark the issue as "Closed (won't fix)"

More like "Closed (works as designed)". If you'll notice in the huge image I posted, I have a screenshot on my project page. It's an example message themed by HTML Mail with all the optional bells and whistles turned on.

The fact that you didn't notice tends to prove my point. Even though I already have a screenshot attached to my project page, since it lacks context or description, you naturally failed to take note of it Apparently, so did rickmanelius. I don't think adding more screenshots will make things any better, especially when they duplicate the content that is already uploaded, linked, and commented.

My point is, this "sprint" or "initiative" or what-have-you is encouraging newbies to take random screenshots and suggest to random module maintainers that attaching those random screenshots to their project pages would somehow automagically make their projects more attractive to the general public.

Well, I'm telling you, it ain't necessarily so.

out of scope but thanks

heather's picture

OK Looks like you might like to comment on some of the issues and threads about improving the project pages on drupal.org. I found these on g.d.o

http://groups.drupal.org/node/15199 - http://groups.drupal.org/node/137914

Slightly out the scope of what we're doing here.

But those are good points about the quality of the screenshot being important. I agree your HTMLmail image you ave there is good, showing the final output. I updated the description above of this sprint, initiative, or what-have-you. Showing some "good screenshots" as examples. Thanks for the feedback.

Better

pillarsdotnet's picture

I updated the description above of this sprint, initiative, or what-have-you. Showing some "good screenshots" as examples.

Much better. Could be improved some more by showing "before and after" comparisons. Since the stated object is to make project pages more appealing, it would be helpful to compare a text-only project page to the same project page with an image added, to visibly demonstrate the added appeal.

And thanks to whoever edited my post above, changing the inline image to a link. I should have done that myself.

The thumbnails on the project

lisarex's picture

The thumbnails on the project page aren't just about providing contextual information, they're about breaking up the wall of text that is the nature of drupal.org. While I agree that a single thumbnail linked to it's larger self isn't as useful as multiple screenshots, it's a lot nicer than nothing, and that is the aim of this sprint: to provide something over nothing to help Drupal site builders.

There are multiple ways to post images onto drupal.org for this project
- node/add/image
- attach to an issue queue comment
- insert inline from a trusted linked source

However we do it, the project maintainer still needs to grab the image file and upload it to their project page.

==================================
http://about.me/lisarex

Can't be done

pillarsdotnet's picture

While I agree that a single thumbnail linked to it's larger self isn't as useful as multiple screenshots, it's a lot nicer than nothing,

(sigh) While I admit to being aesthetically challenged, I bristle at the suggestion that providing useful textual description is nothing compared to a 700px by 200px image.

(Was going to say more, but read Heather's links and it's all been said.)

There are multiple ways to post images onto drupal.org for this project ... - insert inline from a trusted linked source

Can't be done, unless you're a member of the Documentation team. That's my point.

Caught by the spam filter.

pillarsdotnet's picture

Attempts to edit/simplify the wording of the previous post result in:

Your submission has triggered the spam filter and will not be accepted.

So I'm a spammer now. God, I hate g.d.o.

Sorry that this was causing a

greggles's picture

Sorry that this was causing a problem for you. Given that the site sends out tens of thousands of emails a day it's important to us to maintain a proactive, preventive spam blocking technology and it does have some false positives. If you have ideas on how to improve it we'd love to hear them.

For now I've adjusted your account so you won't have to deal with the spam filter.

God, I hate g.d.o.

In the future, please try to be more constructive with your feedback.

Spam

pillarsdotnet's picture

If you have ideas on how to improve it we'd love to hear them.

Some indication of why my post was considered spammy would be nice. Did I have too many HTML tags? Not enough? Was it too short? Too long? Too similar to the previous post (which I was trying to revise)? Not enough words per sentence? Not enough sentences per paragraph? Words used in the post were statistically similar to previously-categorized-as-spam posts? If so, which ones? I had no idea and I still have no idea. All I knew was that I had expressed myself poorly, and all attempts to rectify the error resulted in "You're a spammer. Go away and stop bothering us." And it seems that the maintainers are equally stumped as to how their own system works, because their only way of dealing with the problem is to whitelist the complainers. I still don't see why this approach is necessary on g.d.o. when the main site (which I spend a lot more time on) runs just fine with no such restrictions. Nor will anyone deign to explain, not even with a link or reference to the discussion forum where such issues are on-topic.

Pleasant Fellow Bob

rpruitt625's picture

You maybe deserve a break from coding. Smell some flowers, walk in the woods.
Smoke a joint.

Did I have too many HTML

greggles's picture

Did I have too many HTML tags? Not enough? Was it too short? Too long? Too similar to the previous post (which I was trying to revise)? Not enough words per sentence? Not enough sentences per paragraph? Words used in the post were statistically similar to previously-categorized-as-spam posts? If so, which ones?

It's no secret that we use mollom. It's on the about page linked from the footer of every page. As to specifics of how mollom works, that is a secret. Ask them.

And it seems that the maintainers are equally stumped as to how their own system works, because their only way of dealing with the problem is to whitelist the complainers.

Again, you're not helping you're just insulting. FWIW, I actually do know a fair bit of how Mollom works.

You asked:

I still don't see why this approach is necessary on g.d.o.

Which I expected you to say and pre-emptively answered:

Given that the site sends out tens of thousands of emails a day it's important to us to maintain a proactive, preventive spam blocking technology and it does have some false positives.

Spammers tend to hit the forums or book pages on drupal.org. The default modes of interaction on drupal.org don't involve sending email to people because of those events. So spammers are less of an issue there. The lead maintainer of drupal.org is opposed to black boxes even if they would benefit the site. That's why it's not deployed on d.o

It seems like you're disagreeing with a lot of people in this thread. You disagreed with the original purpose of this thread. And then you got mad at the robots that block spam. And then you got mad at me for making your life easier by whitelisting you. Maybe, as rpruitt625 hinted, the problem is your attitude which you could adjust before interacting further. Karma is the currency of open source and you're not doing any favors for your own karma with this combative attitude.

For what it's worth:

  • I think this sprint is awesome because it helps people choose which module to use
  • I think the engagement from newcomers that it promotes is awesome - we need more novice tasks that provide value and engage people in the issue queue
  • I congratulate the folks who came up with and promoted this idea

Drop mollom, or live with it

rfay's picture

The problem is Mollom. Mollom, as we all know, is arbitrary about its decisions and provides no recourse. And it has a huge number of false positives. Site managers don't ever find out about them because people just go away frustrated. This issue has proposed an appeal process for Mollom, which would also help Mollom to learn about false positives and possibly improve their system. But it has gone nowhere. My old rant remains the same about Mollom.

Could we just remove it? I'd file the issue. I won't install it on any site I manage because it frustrates users so dramatically.

Let's move discussion

greggles's picture

Let's move discussion somewhere more appropriate: http://drupal.org/node/1286660

A bummer

rickmanelius's picture

Hey Everyone!

Sorry I seemed to have caused such a stir by my participating and putting together some screen shots. No, I did originally see the screen shots section on HTML mail. I swear I actually did a search for the word screenshots (not screen shots) and therefore missed it.

The bummer for me is that this sounded like an awesome idea so I plunged in, hoping to inspired others to follow. I've been a lurker in the drupal community and I'm always keeping my ears open for things/ways that I can contribute. It's a shame that the effort seemed to cause more confusion than benefit!

I like to get an idea and run with it... but I think given all the complexities and size of d.o and the community, some sanity checking might be in order before running with scissors.

Definitely agree with greggles for the need of more novice tasks, so that newbies can ease in slowly instead of hitting the learning cliff or not contributing at all.

Sorry

pillarsdotnet's picture

Sorry, rick -- I don't mean to be discouraging. At first I was confused as to why you were submitting a screenshot that duplicated one I had already posted, and why you would think that it would improve my project page. Then I followed your links and realized that you were just blindly following the advice of someone who (imho) should know better.

Yes, I do agree that adding a representative screenshot to a project page that currently lacks one is almost certainly helpful.

No I do not agree that screenshots are "nicer than nothing" when the "nothing" happens to be a description of what the project is and how it works.

As for the need of more novice tasks, there are currently 157 novice tasks in the queue. Isn't that enough?

I swear I actually did a search for the word screenshots (not screen shots) and therefore missed it.

Which is yet another indication that the bigger problem is the layout enforced by the d.o. project system. If the layout were more flexible, I believe more project maintainers would make the effort to include graphic images on their project pages. I know I would.

No prob

rickmanelius's picture

Hey pillarsdotnet,

No worries. My comments were meant at a broader level. I've tried contributing a few times to efforts that ultimately got tangled up. In this case, I understand your reasoning and logic, so no worries.

As for the new novice tasks, totally. Although I consider myself a mid level developer, I'm a beginner when it comes to submissions/patches, etc.

I'll leave this thread for now because I think there are broader issues at play. But in the end, we're all just trying to make Drupal better... so I'm glad this thread at least generated some discussion versus no response at all.

Please join the discussion about project pages

heather's picture

1) Novice tasks are great - especially for new developer contributors. This initiative, or what-have-you is actually a proof of concept of a non-technical type of task.

Just some background... This is also a proof of concept of an online sprint. I'm trying to learn what it takes. Now I feel like I've spent most of my time trying to convince you... of its value, and less actually doing the sprint :/ I think Jakub Suchy is doing a much better job with his 5x5 challenge. https://acquia.com/blog/5-days-5-challenges-drupal However, I can point out to you that having those "granular tasks" is really important (of which a screenshot sprint is one). Also he's doing a better job of creating awareness- see related tweets.

2) We disagree on the value of screenshots, and we should leave it there. I often come across criticism of our project pages not having images, which bolsters my confidence in the value of this. You've done an excellent job with your own documentation and I'm not discounting the value of that work.

3) Please join the discussion about Improving the project/module pages:
http://groups.drupal.org/node/144604
It looks like you have other ideas about improving drupal.org, please check out http://groups.drupal.org/prairie-initiative Some great stuff happening there too!

I hope, if you feel you have something more to add to this thread... it's a screenshot. I'm just going to focus on the central effort here... seems such a shame these comments have veered so very far off the main point. I'm not going to add anything further.

Best wishes, I do mean it. Just feeling a bit exhausted.

I liked the spirit

rickmanelius's picture

I think that was one of the reason's I put up my 'bummer' post. It's not that people disagreed on this particular issue... its just that a lot of enthusiasm/energy gets lost when we all tangle up!

I think this was a great effort and you shouldn't be discouraged. I know it'll make me consider some things before starting a sprint. So in that sense, this experiment was valuable!

I uploaded some screenshots

infowonders's picture

I uploaded some screenshots too:

http://drupal.org/node/1285698 typebased theme
http://drupal.org/node/1285696 koi theme
http://drupal.org/node/1285690 four seasons theme
http://drupal.org/node/1285682 black piano theme
http://drupal.org/node/1285666 nitobe theme
http://drupal.org/node/1285662 taraki theme

....and I think that adding screenshots is absolutely necessary.

thumbs up

heather's picture

Great screenshots, Infowonders :) I like how you added in the extra content, and also showed the footer too.

One of my screenshots was picked up by the maintainer. Nice feeling :)
http://drupal.org/node/1275742#new
I'm sure yours will be soon too.

Thanks for participating.

Thanks heather, one of my

infowonders's picture

Thanks heather, one of my screenshots is already accepted in http://drupal.org/project/fourseasons :)
I'll try to contribute more until the end of month.

cool! thank you :)

heather's picture

cool! thank you :)

Need screenshot for Media

aaron's picture

The Media module could use a screenshot: http://drupal.org/project/media http://drupal.org/node/1291256 #D7MediaSprint

Aaron Winborn
Drupal Multimedia (my book, available now!)
AaronWinborn.com
Advomatic

It looks like I missed the

christefano's picture

It looks like I missed the September 30th timeframe (I just came across this post today) but I love this idea! I'm committing myself to documenting how to use Git Tower and Gitbox with Git on Drupal.org.

SJourney's picture

asking them to make (where applicable) a screenshot for their project ?

helping out

heather's picture

Well... I think it's kind of amazing that module maintainers donate their time and commit anything to be available for free. I'm not that keen on asking them for more at this point.

I guess the idea was to see if we could come up with ways non-coders could make a contribution. I also wanted to see how to do an online sprint.

I think Jakub made a better effort with the same goals with his 5 day get involved sprint. Much broader scope.

I'll be gathering some details and wrapping up this thread!

too bad your thread got hijacked it was a good idea

NWwaterboy's picture

amazing how a couple of people can derail a great idea

ScreenShot Project

JohnM0254's picture

I have a drupal site with digital downloads. I need to add a feature to my site allowing visitors to enlarge the screen shots. Would anyone have skills in doing this? I'm willing to pay a programing fee.