Community Looms UI: Content density adjustments π§
View Comments and ReplyTranscript
Show Transcript
Hey, I just wanted to share a quick update to the community Looms page based on some conversations we had about three or four weeks ago.
The gist is basically we talked about the contrast between Lume HQ and some of the marketing pages when it comes to content density.
And if we really want this community page that is public facing to be this dynamic place where content is constantly submitted and refreshed.
Like how might we find a balance between the friendliness, the spaciousness of the marketing site and then the data or content density of something like Lumhq.
Or really most dynamic consumer product experiences like Twitter, TikTok, et cetera. Where you see a lot of content in a small space.
So this is what we have this is what we had rather a tall heading. The distances between the rows is fairly generous.
The heights of the context below the thumbnail within each of these Loom previews is quite generous as well. Like the space here, the space here.
So I just looked for a bunch of different opportunities to make some changes here. So this is basically where I wound up.
So the header is significantly less taller. The title is using the large size instead of the extra large size from the thread design language.
And then everything just gets brought up because of that change. And then within the thumbnails themselves, those have reduced in size as well by just thinking about the distribution of space within there and making those tighter.
And then also still having quite spacious gaps, but not as spacious. They're about 50% less between each row of content.
I still think it feels like quite spacious. And when you zoom out, it definitely gives you a sense of just how much content fits on the screen.
You get a lot more on the screen per scroll, which I think is nice. And then I did the same exercise for this page.
So this is when you actually tap See more on one of these sections. So if you go to from the Loom community, you tap See more.
We're using quite a large header for that. And when I say that, I mean both the type size and just the gaps here and here.
Justin, sorry if I messed anything up. I'm definitely just referencing thread and seeing what makes sense. But I basically did the same kind of exercise to tie it more closely to this one.
So just making that slightly tighter and you can kind of see I think this one has an even more dramatic difference in terms of the amount of content it fits on the screen.
While still I think when you actually zoom into 100% feeling nice and spacious. And actually it's helpful to kind of zoom into 100% because you can really see just how much content fits before and then after.
And the same for home. So really getting just like a kind of preview and seeing mostly header on my screen at least and then getting a lot more content here.
So that's, that it's a little thing. But I also did the same exercise for the title on the actual video page.
So using the medium size instead of the large size that I think judson you are using previously. And that's really it.
I explored one other thing. I'm not sure how I feel about it. One thing a few of us were talking about is just like in addition to saying from the Loom community and on Loom HQ, we actually say within the thumbnail itself, let me just show you.
We have this metadata that says Looms Community. If it's shared to two spaces plus Looms Community, we have to kind of combine those two phrases.
But we basically display that context here. But one thing we've talked about is there anything else we should surface to indicate that it's from the community?
Like a badge or something like that. But the more I look at this, I think actually what we should do is not add a badge to both the marketing site and to Lume HQ to signify Community.
But instead we should just add basically the equivalent of the metadata. So Looms Community to all of these so maybe below the name in the same kind of way.
Yeah, let me know what you think. Let me know if you have feedback there. But I think that's probably what I'll do.
And I'll find a way to make it so it doesn't make this like super tall. But anyway, thanks.
Transcript
Show Transcript
Hey, I just wanted to share a quick update to the community Looms page based on some conversations we had about three or four weeks ago.
The gist is basically we talked about the contrast between Lume HQ and some of the marketing pages when it comes to content density.
And if we really want this community page that is public facing to be this dynamic place where content is constantly submitted and refreshed.
Like how might we find a balance between the friendliness, the spaciousness of the marketing site and then the data or content density of something like Lumhq.
Or really most dynamic consumer product experiences like Twitter, TikTok, et cetera. Where you see a lot of content in a small space.
So this is what we have this is what we had rather a tall heading. The distances between the rows is fairly generous.
The heights of the context below the thumbnail within each of these Loom previews is quite generous as well. Like the space here, the space here.
So I just looked for a bunch of different opportunities to make some changes here. So this is basically where I wound up.
So the header is significantly less taller. The title is using the large size instead of the extra large size from the thread design language.
And then everything just gets brought up because of that change. And then within the thumbnails themselves, those have reduced in size as well by just thinking about the distribution of space within there and making those tighter.
And then also still having quite spacious gaps, but not as spacious. They're about 50% less between each row of content.
I still think it feels like quite spacious. And when you zoom out, it definitely gives you a sense of just how much content fits on the screen.
You get a lot more on the screen per scroll, which I think is nice. And then I did the same exercise for this page.
So this is when you actually tap See more on one of these sections. So if you go to from the Loom community, you tap See more.
We're using quite a large header for that. And when I say that, I mean both the type size and just the gaps here and here.
Justin, sorry if I messed anything up. I'm definitely just referencing thread and seeing what makes sense. But I basically did the same kind of exercise to tie it more closely to this one.
So just making that slightly tighter and you can kind of see I think this one has an even more dramatic difference in terms of the amount of content it fits on the screen.
While still I think when you actually zoom into 100% feeling nice and spacious. And actually it's helpful to kind of zoom into 100% because you can really see just how much content fits before and then after.
And the same for home. So really getting just like a kind of preview and seeing mostly header on my screen at least and then getting a lot more content here.
So that's, that it's a little thing. But I also did the same exercise for the title on the actual video page.
So using the medium size instead of the large size that I think judson you are using previously. And that's really it.
I explored one other thing. I'm not sure how I feel about it. One thing a few of us were talking about is just like in addition to saying from the Loom community and on Loom HQ, we actually say within the thumbnail itself, let me just show you.
We have this metadata that says Looms Community. If it's shared to two spaces plus Looms Community, we have to kind of combine those two phrases.
But we basically display that context here. But one thing we've talked about is there anything else we should surface to indicate that it's from the community?
Like a badge or something like that. But the more I look at this, I think actually what we should do is not add a badge to both the marketing site and to Lume HQ to signify Community.
But instead we should just add basically the equivalent of the metadata. So Looms Community to all of these so maybe below the name in the same kind of way.
Yeah, let me know what you think. Let me know if you have feedback there. But I think that's probably what I'll do.
And I'll find a way to make it so it doesn't make this like super tall. But anyway, thanks.