Twenty Fourteen: Ditch the diagonal lines placeholder for featured images.

[georgestephanis]

These just look bad if the featured image happens to have png transparency, and we shouldn't be shaming users into setting featured images if they choose not to.

[georgestephanis]

OR

Leave the diagnoal lines or another placeholder, only if the current user has the appropriate permissions. Then set it as a dropzone, so they can just drag an image from their desktop onto the front-end of their site to upload that post's featured image.

[georgestephanis]

​http://plugins.trac.wordpress.org/browser/jetpack/trunk/modules/custom-post-types/comics/comics.js

has the code @cfinke used to do something similar in the Panel wpcom theme. I'll get a patch together shortly to demo how this could work in twentyfourteen.

[MikeHansenMe]

Patch to remove lines.

[georgestephanis]

The patch is a good start, but has some problems. With it applied, the gap between articles goes to nil:

​http://cloud.stephanis.info/image/3Y3z0R3h2T1n

I'd also like to hear more input as to preference between ditching and turning it into a dropzone.

[celloexpressions]

The dropzone idea would be awesome!

I think it's actually a perfectly acceptable graphical element if there is no featured image, though. There are ways to work around the transparency issue.

[iamtakashi]

I'd like to keep the diagonal lines placeholders for encouraging users to add featured images that are important visual elements for the theme, and a lead image for a post is pretty common design pattern for a magazine site which is what Twenty Fourteen will be made for.

We could improve the lines by using only CSS as opposed to with a pattern image and tone down the color a bit.

Turning the placeholder into a dropzone is a cool concept for setting the featured image which initiates the idea of "front-end editing". But if we go for it, we need to come up with an elegant design idea in order to let users know they can upload.

[obenland]

Replying to iamtakashi:

I'd like to keep the diagonal lines placeholders for encouraging users to add featured images that are important visual elements for the theme, and a lead image for a post is pretty common design pattern for a magazine site which is what Twenty Fourteen will be made for.

We could improve the lines by using only CSS as opposed to with a pattern image and tone down the color a bit.

I feel the same way.

Turning the placeholder into a dropzone is a cool concept for setting the featured image which initiates the idea of "front-end editing". But if we go for it, we need to come up with an elegant design idea in order to let users know they can upload.

We could make it a form to users who have permission to edit that post. As much as I think this would be nice to have, I don't think this would go with trying to keep default themes simple.

[MikeHansenMe]

patch fixes the transparent feature image

[MikeHansenMe]

This patch fixes the feature image problem and allows us to move forward on changing it to be css instead of an image. This patch will also allow us to move forward with the drop zone if we choose to do so.

[georgestephanis]

I like it. +1

[obenland]

I really don't think we need to change this. I'd consider transparent PNGs an edge case for featured images. And even if used, I they don't think it looks necessarily bad: ​http://screencast.com/t/jsJNzTcSgQk

I agree with ​what Takashi said earlier, Twenty Fourteen works a lot better with featured images, just like Twenty Thirteen works better without a sidebar.

[MikeHansenMe]

different example that does not look very good

[iamtakashi]

I agree with obenland to consider transparent PNGs as an edge case for featured images.

The lines also intend to keep the layout treatment with left-sticked small featured images. ​https://www.evernote.com/shard/s14/sh/a957de3b-a765-4040-a5cd-091c8ef246f7/f6415ef6d6f2425efff285d9b8b3cb4f/deep/0/Screenshot%2027/08/2013%2017:28.jpg

We still can tone down the color of the lines a bit though.

[obenland]

​In office hours today, we decided to keep them around.