Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Need better art direction diagram #12

Closed
marcoscaceres opened this Issue · 18 comments

6 participants

@marcoscaceres

The current Art Direction figure in the spec is not ideal. It would be nice to have a diagram that both explains the concept and is, itself, also responsive (when used with picturefill).

@jeremyworboys
Collaborator

Changed tact: http://d.pr/i/lqfH

It's simple, explains the concept and is background independent. Working on arranging it in a way that we can make it responsive.

@ShaneHudson

Is it worth using one or two non Apple products to demonstrate that it really is cross platform?

@Wilto
Owner

+1 to chucking a couple of non-Apple screen sizes in there.

@marcoscaceres

It was mentioned in IRC that explicitly using any company's products explicitly won't win us any friends. We should be vendor neutral in all our work.

@jeremyworboys
Collaborator

Just caught the convo on IRC. Here is an updated copy with a Nook tab and a generic Droid: http://d.pr/i/yH8N

@ShaneHudson
@marcoscaceres

Looks like we are getting there. @jeremyworboys, can you please move the psd file into the images directory on the gh-pages branch. That way, we can collaborate on it.

Some notes:

  • I think we need a better picture that more clearly shows what is being "art directed"
  • we should remove identifying marks on devices, including buttons.
  • at least one device should be in portrait mode.
@anselmh
Collaborator

Agree with Marcos.
Also I think we should add a Kindle / Kobo with Monochrome image-type. For the crops an image like the Obama-one works much better. Or provide two images. The more examples we have the easier it is to understand.

@marcoscaceres

Instead of adding another device, we can probably just make one of the images monochrome inside one of the devices. That will get the point across.

@jeremyworboys
Collaborator

I'm thinking maybe throw another device or two in there and lay them out horizontally next to each other. We can then cut off the outer devices for art direction when displaying this image. Based on this the outer devices should not be important for conveying the message.

@anselmh
Collaborator

IMO it must not contain another device. I just think the monochrome part is an important feature of respimg and Kindle is the first device people understand why it would be useful.

@ghost

Could someone please explain what "art direction" is?

@marcoscaceres

@mahroof-ali please see: http://usecases.responsiveimages.org/#art-direction . If that text doesn't make sense, then we need to fix it. It's that text that we are trying to convey as an image.

@marcoscaceres

I've updated to use the following image (thanks @wilto!). However, the image has a few problems, namely the image shown in the picture is clearly not "responsive", otherwise the text in the image ("there is life out there") would be legible at a small size :

@Wilto, could you possibly provide the device frames from the image as a PSD? We could then build all sorts of really nice images from those.

@Wilto Wilto was assigned
@Wilto
Owner

From IRC discussion: the lead background image on responsiveimages.org is going to be swapped out for a content image, paired with a description. The Dribbble screenshot above is showing Picturefill in use, though Dribble is only using it for resolution switching. This is a good opportunity to finally get some “in the wild” examples of the picture pattern showcased on the site, along with a brief write-up of how it’s being used.

(@hellogeri, have we gotten permission from whoever posted that Dribbble shot? Else, we can use one of ours.)

@hellogeri
Collaborator

@Wilto We don't have permission, but I can likely get it pretty quickly (or, use one of ours like you said!)

@marcoscaceres

@Wilto, @hellogeri, rotating banner graphic? always fresh :tm:

@marcoscaceres

Ok,

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.