[Feature]: Hero Adjustments

[akmcbroom]

Problem / motivation

For some art/trailers in the hero the image is darkened by the circular overlay style, vs doing a left and bottom third gradient like the native Apple TV app does it. Possible to mirror that approach for the gradient overlay?

Also possible to cap the logo width and height, similar to the native Apple TV app? Some logos seem overly large/wide.

Is it also possible to match the font opacity styles for the cast info on the right as well?

Proposed solution

See above.

Alternatives considered

Your app is very polished, more than most and I appreciate your attention to detail! Great work!

Affected backend(s)

None

[akmcbroom]

Here is a good backdrop that shows the rounded overlay style vs not (The other app is Rivulet)

[thatcube]

Logos:
I see what you mean about logos. It's given me some trouble because the logos are so inconsistent in their sizes. Some logos are very short whereas others are very tall and wide. I was trying to normalize based on visual weight rather than specific sizes but I think it's different when you compare the hero on the home page to the hero on the detail page. I'll give it a more detailed pass soon and compare like 10-20 different logos to see if I can't figure it out.

As for the backdrop, I'll take a look but I'm not going to promise that I'll change it. Part of the challenge is that those hero images could be solid white, so it needs to be dark enough to make the text legible. It also blends in with the background of the page so it needs to fade gradually and a less dramatic gradient doesn't do that. I'll check out the rivulet app, but if they're not completely fading into the page background that might be part of the reason there's a difference.

Perhaps I could add a user option to disable the fade, which would allow for more subtle gradients and vibrant artwork. It's also most vibrant in the "Black" theme because solid black is the best color for this effect rather than a dark gray or white.

Appreciate the thoughts and tanks for the detailed feedback and images! The examples from other apps help a lot.

[thatcube]

I suppose I could also just not have the gradient at all at the top of the page but then it looks a little lopsided in my opinion

[akmcbroom]

Appreciate the detailed response!

I think it is just more of the approach for the overlay/fade. Ideally the left 3rd and bottom 3rd get the fade, which accounts for all the text areas nicely, and keeps the middle and upper right vibrant. This is how the native Apple TV app and Rivulet approach it, and I think it works well and looks sharp.

I do front end design, so I am not familiar with swift dev, but if the logo could have a max width and max height with the logo object contained and placed bottom/left, that may help account for variances and keep it constrained in a nice way.

[thatcube]

Here's an example of a short and wide logo that looks "right" to me, if I make it less wide it won't align with the text, which is maybe fine, but that's the current max width. And

I think your logo looks particularly large because theres no text/buttons currently. Here's what it looks like for me:

[thatcube]

I'm also updating the hero gradient now, should release later today

[akmcbroom]

I think this looks great!

For the logo, looks like the Apple TV app caps the width at 3/4 of the description width. It's highly subjective, but I like the hierarchy of the less wide logo above the wider text. I am just nitpicking! You do great work!

[thatcube]

I'll leave this open in case others have thoughts on the logos, but I prefer having them a bit larger myself. But who knows, maybe I'll change my mind in the future. The goal isn't to be exactly the same as Apple - I am reusing a lot of their design language, but the goal is to ultimately be better! And the logo is a huge part of the identity of a show, so I'm more in favor of promoting it. I've dabbled with the idea of a more user-customizable hero, but I want to get the app in a better state before I do that.

Otherwise the gradient changes should be in the next build. Thanks for your thoughts and help testing!

[akmcbroom]

Fair enough! I'll be able to test the new build later tonight and get back to you on any issues, etc.

[akmcbroom]

As it is totally subjective as to what is "better", I think an option would great!

For me the use case for a smaller logo is so it covers less of the art/trailer, and has a better visual hierarchy/balance with the info below. This one is a better example than the one above. Some logos do look too small with the Apple sizing, but in general I think it works better than the larger variation, but again, it is very subjective.

Edit: The updated gradient looks great!