DEV Community

Changelog: New Home Feed Styling

Josh Puetz on May 12, 2020

Starting today you'll notice a new look on the home page. Thank to a huge effort by Pawel/@pp many components in the home page new feed has been ch...

Read full post

Tyler V. (he/him) • May 28 '20

I really liked the way this looked initially, but I've found that since the changes were made, I'm no longer looking at any articles that aren't coming through as notifications.

Part of it I think is that it feels like the Titles of posts are blending into the comments that are being shown? Maybe there isn't enough whitespace separating individual posts vertically?

I also find it off-putting when something like this happens:

The comments are shown and have an image, causing the actual post information to feel secondary to the comment w/ the image from the post/user preview.

Tyler V. (he/him) • May 28 '20

Admittedly, the screenshot I took doesn't exemplify the issue very well - making me think that part of it is the articles being too close together vertically, or a lack of distinction between where the previous article ends and the new article begins.

Ben Halpern • May 28 '20 • Edited

This articulates something we've also noticed, so we'll be looking to make adjustments. Thanks a lot for the feedback.

amananandrai • May 12 '20

I like the new like and comment icons and also the way profile picture is represented in the cards along with the organisation

Ben Halpern • May 12 '20

Yeah, it's a nice detail

Waylon Walker • May 12 '20

The new design looks 👌 very nice. It feels a bit more lightweight.

Waylon Walker • May 12 '20

Just saw it on mobile... Even better than desktop. 🤩 Well done.

Ben Halpern • May 12 '20

🎉

ItsASine (Kayla) • May 12 '20

Initial thought is I don't care for it. I'd rather see text blobs on the home page as a preview of the article rather than a preview of a reaction to the article I haven't read yet. It's also jarring to see article article article wall of text article article. Before I found this post, I assumed my CSS got all garbled and the walls of text were unstyled article headings somehow.

Paweł Ludwiczak • May 13 '20

This is also something we wanna add in the future but previous feed cards were not ready (in terms of frontend code etc) to bring in article preview. Now they are, so I think it's a matter of time :)

🦄N B🛡 • May 13 '20

I kind of had the same reaction. But I feel silly complaining because of how much better it all is than, ahem, competing platforms.

Vaibhav Khulbe • May 12 '20

Definitely liked the new icons for like and comments! 💯

But...can we get a feature where we can like the post from the home feed?

Ben Halpern • May 12 '20

@pp I think we should work towards this

Paweł Ludwiczak • May 12 '20

yeap, that's definitely the plan but not sure on the timeline though :) since this brings some questions like how should we treat multiple reactions etc - things that we haven't really thought-through yet. BUT again - that's definitely our plan :)

Vaibhav Khulbe • May 13 '20

Awesome!

🦄N B🛡 • May 13 '20

That way lies darkness, because I will judge these things even more by the titles than I already do.

Paweł Ludwiczak • May 13 '20

That's one thing we wanna address somehow before letting people react to articles from the feed. We still want reactions to have certain weight... I don't think we want reactions to mimic Facebook approach - we definitely want users to read through an article first before reacting to it instead of almost automatically hit "like" "like" "like" "like" "like" under every post in the feed.

🦄N B🛡 • May 13 '20 • Edited

Above Response Too Long

Can you please put a title in bold for your reply? That way I can give my reaction before reading it.

But seriously, I commend your attention to the finer points of UX and the kinds of relationships it can enable among readers, platforms, and writers.

Becoming yet another Social Media extreme of the shallow, trite, and immediate is still in the cards for dev.to.

SparklingINsilence • May 14 '20

Lovely new look. Well done 😍

Ben Sinclair • May 30 '20

I like the comments in my feed, but what makes a comment "prominent"? I can't see a pattern to why I see some comments and not others.

Ben Sinclair • May 30 '20

Oh, I found it, in app/models/article.rb:31

  has_many :top_comments,
            -> { where("comments.score > ? AND ancestry IS NULL and hidden_by_commentable_user is FALSE and deleted is FALSE", 10).order("comments.score DESC") },
            as: :commentable,
            inverse_of: :commentable,
            class_name: "Comment"

So it's top-level visibile-to-you comments in order of score, which is... wait...

(number of reactions) + (number of child comments / 2) + (bonus) - (spamminess)

and bonus is 2 points for (> 200 characters) and 1 point for including a code block.
and spamminess is 0 for normal users and 100 for anonymous users.

So it's mostly top-level visibile-to-you comments from non-anonymous users based on number of reactions and replies, and the rest is important but uninteresting to general users.

Eric Ahnell • May 12 '20

This is good! However, the tags are... kerned? too close to the article title on Safari, which definitely looks weird.

Paweł Ludwiczak • May 13 '20

I'll give it a look, thanks!