I was suggesting to move a couple of buttons around:
reload to be moved in the three-dotted menu (as there’s the swipe down interaction to refresh. And not sure it can be a very frequent action to take. Correct me if I am wrong)
sort and filter could both be moved right above the episodes like on Dribble (both Google Podcasts and Spotify do this with their sort buttons.)
settings we can keep the cog icon only but have it visible in the action bar
Here’s what I’m thinking about:
(Sorry again for the quality. Wanted to create a quick visual so it can be easier understood)
Sorry for the late reply. As I wrote on GitHub: I think it might be good to reorganise things here a bit. A few thoughts on your proposal:
Any particular reason you split filter & sort to left & right? I feel it’d make more sense to have them both together at the right (where it wouldn’t overlap with the metadata).
Where would the icons be placed when you scroll up, and the header block (podcast title/author) is gone?
I’m also thinking that the earlier proposal to give more prominence to the settings in the header can work nicely (with some changes). Think it might be even more clear than moving the cogwheel to the top bar.
hello @keunes apologies for the late reply as well!
I further evaluated my proposal by splitting the 2 buttons and it seems like an overkill atm.
I suggest moving the reload button inside the 3-dotted menu to reduce the number of buttons in the top bar. It’s quite cluttered from a UI standpoint and users nowadays are quite familiar with the pull-to-refresh gesture.
And regarding the settings button, do you have some suggestions in mind about the changes? What would make it better form your POV?
As discussed and promised I have recreated the current podcast screen in Penpot, so we can more easily start hacking the design:
The light border & background are too prominent in the dark theme, but if these elements are adjusted to the theme they could work nicely. I’m not really in favour of moving the settings button in the app top bar and prefer (a variation of) the approach of you that I shared above.
Maybe we should consider just having two buttons ‘Information’ and ‘Settings’ (without mentioning ‘podcast’ because I think that should be clear given their placing, and without having the icons because of spacing).
I had a look at it earlier - thanks for that. I see they’ve also added some nice new features to Penpot
I was working on the ‘Podcast view’ screens in Figma but will start to move to using Penpot. These are pretty rough and would still need work. I hope this isn’t too drastic a change - I can always dial things back. Any feedback is welcome.
Left image is the app as it currently is - right was a first attempt
Changes - A lot of these change were influenced by looking at other podcast apps as well as my own experience using the app.
Buttons moved lower - they are too hard to reach at the top - by lowering them the user can press them with their thumb.
Sort and Filter combined into one feature (arrows icon) I think having these 2 is overkill and too complex - I think most people would only use the old > new function. I changed the icon as the lines for ‘sort’ was to similar to the hamburger menu
I haven’t seen another podcast app that uses a refresh button - I also think it should be moved to the ‘three dot menu’
‘Podcast Info’ button also moved into three dot menu - this actually might not be such a good idea, however I think some of the info on this screen such as stats could be incorporated onto this screen.
Added ‘Subscribe’ button - I find it’s currently too hard to follow/unfollow a podcast
Added ‘Notification’ button
Podcast artwork enlarged and corners rounded
Here’s 2 other versions I did, I think the second is the most successful, although I’m not sure the rounded corners work atm. What are you thoughts?
Personally I don’t think it’s important to have these features visible when scrolling down - the user is likely looking for a particular podcast episode. The search function would be useful, and I would also show the Podcast title.
Bring share button onto this screen? It feels a bit hidden away on the information screen
The search button could be brought lower (could be made into a search bar with the three button menu next to it.)
The Lists change in size depending length of podcast title - this looks a bit messy and should be consistent.
Let me know what you think - if this is not the kind of thing your after, don’t be afraid to say!
I would swear you mentioned this and I replied to this before – but I can’t find a thread on GitHub or the forum. What I can remember from my reply back then: a few years ago is a long time in the world of apps. And the complaints were made in a period where there was neither pull-to-refresh nor a refresh button. So I would go and give it a try - we can see if we get many complaints.
Nice work @George_Rowland. I particularly like the right version in the second image you shared. Thanks for sharing the logic behind the changes, that definitely helps to appreciate it! A few thoughts:
Combined sort & filter button: I’m not a fan of this - I appreciate your reasoning behind it but they’re two different mechanisms that I think would be hard to combine. We would have to think about the dialog/menu structure behind this single button - which adds a whole other set of questions. For now I would go for having the filter there prominently, having the sort in the overflow menu.
I think indeed the podcast info button should be in the prominent list. It gives access to donation options as well as statistics - both which deserve to be seen.
Subscribe button: subscribing currently cannot be done in a full podcast screen - the Add podcast/Discovery screen opens a ‘pop-up’. I believe there’s several technical reasons for this. So effectively the button in this screen could only be used to unsubscribe, currently. But, again, I appreciate your point and think it’d be good to discuss the options.
Notification button: I really wonder how many people enable notifications for their podcasts. I’m subscribed to a good bunch of podcasts which all release frequently so I’d go crazy with notifications. Besides, it’s also available in the Settings.
All in all I would (for now) go with Settings, Info and Filter.
But essentially it’s still icons in the ‘title’ area. The point of this change was to make the settings more prominent. Do you think this change reaches that goal? (Honest, open question - I feel it does but I’m not sure why, thus I find it hard to give a definitive yes or no.)
I’ve added a new Penpot project file called ‘AntennaPod - UX Sandbox’. This is a space where people can experiment and collaborate. I was thinking, things that get finished/approved can then be transferred to the other project file.
So far all I’ve done is redo the current screens that I did in Figma, these are very similar to what @keunes has already done except the buttons are buttons now have an area of about 44px (see image below) Also the phone size is slightly longer to reflect dimensions of current phones. If people would prefer we stick to the 360 x 720px let me know.
Regarding the task of making settings easier to discover, I was wondering if anyone has considered making a help/tutorial feature in the app? This is a fairly common feature and could be something that starts when users first open the app (or from the setting menu). The user is given the option to skip it or proceed with the tutorial where they simply swipe though screens that highlight and explain the features and settings of the app. If people like this idea I can create some mock ups of what this could look like.
Lastly, would anyone be interested in doing another group call? There’s been interest from more people getting involved and it might be nice way to introduce them
Are you saying my phone is not a current phone!?!?!? I took my phone (Fairphone 3) as a base, than deducted the Android 11 bottom navigation bar, which, with AntennaPod, is visible and whose space cannot be used for the app. I don’t really see a reason to change, but I have no objection to the change either
It has been brought up in the past, yes. If I remember correctly @ByteHamster was not a huge fan of this idea?
Community calls are supposed to be every month, yes. The first next one would be Saturday 9 April. Details here!
But maybe your question was more about a design-specific call like we had before, @George_Rowland? Happy to have that as well – I’ve already (well, I was late, but I have now) sent a message to the two new folks that indicated interest.
I’m not a huge fan of having tutorials when starting the app. I’m always annoyed by those because they either tell me things that are obvious or tell me things I am not interested in when trying the app for the first time. Even if there was a tutorial, it would probably deal with things like subscribing, queue and inbox/new, not with more “advanced” things like per-podcast settings.
Yeah, it was just an idea I was throwing out there. I think a tutorial can useful for introducing features that the average user isn’t familiar with. However most people understand that a cogwheel = settings as it’s pretty common place these days.
Personally, I think making the settings easier to discover is as much about the whole UI than just adding ‘settings’ next to the cogwheel icon. Currently the top of the screen there is 8 icons and I think that removing/moving them to the ‘dotted’ menu in to right would go some way in making things more streamlined and easier to use. As it is it’s just too busy and feels overly complicated. That said there might be people who like this.
As I’ve said before, bringing some of these icons down below the Podcast title/artwork makes them easier to reach and puts more emphasis that these are settings/features for that particular podcast not just for the app in general.
I did something I think I prefer not using rounded corners on the bottom but I do like the fact that the cover “rests” on the button bar. The scroll behavior feels different (and a bit “wrong” on first use).
I like the rounded corners, fits nice with the overall direction Android12/MaterialYou is going.
Side point, is there interest in including material you colors somehow, would be awesome if it would be easy to implement