Hello,
Following up on the call for UX/UI designers, we have had meetings with people interested to contribute. There was a request to provide more detailed descriptions of what is needed. We’ve tried to provide that below, in detail for the most important screen and to a lesser extent for the other, related tasks.
For design approach, Google’s Meterial design 3 should be applied: https://m3.material.io/
Player screen
- On the player screen, several features need to be added and adapted. Key here is pathways to access these features; most of these features have dedicated screens or modals that will be worked on by others.
- Important things to consider when redesigning the player screen are:
- Cleanness (AntennaPod aims to be simple to use for users)
- Discoverability (to keep the app simple to use, key features should be easy to discover - I can see swipe navigation to be used because it is a clean & easy way to navigate but we do have concerns over discoverability)
- Adaptability (many of the features may or may not be supported by a given podcast; the screen should be ready to display or hide elements accordingly; at least one design must show state in case all below functionalities apply)
- Bottom navigation (initial designs) have been prepared on Penpot and work is in progress; this will make screen estate smaller and make queue & downloads quickly accessible)
- Screen variation (most users use the app in portrait mode, but an accompanying landscape mode must be designed as well)
- Key functionality to maintain:
- Playback control (playback settings, play, pause, RW, FF, next episode)
- Tap cover image to pause
- Way to access Chromecast (via top bar)
- Way to mark episode as favorite
- Way to share episode
- Way to open the podcast of which the episode is part
- Way to open the episode website
- Key functionality that should probably be adapted:
- Way to access shownotes/description
- Way to access chapters, skip to next chapter; jump to previous chapter can probably be dropped (#6568); ideally a way is found to show current chapter title (#6249); ideally a way to show the link associated to a chapter (web page related to the chapter topic) is added. Technical specifications: ID3v2;
<podcast:chapter>;<psc:chapter />; VorbisComment. - Way to access sleep timer settings; ideally a way is found to show remaining time (#7230)
- New functionality that should be made available:
- Way to access transcript; display current speaker name & image based (initial implementation done in #7186; mock-ups for displaying speakers with subtitles on Penpot)
- Way to bookmark an episode at a specific timestamp, which will allow user to enter text at that point or at later moment (#1946), and a way to access that episode’s bookmarks. UX decision to make: bookmarks as a dedicated feature with own UI, or as ‘custom chapters’ and part of the chapters UI?
- Way to to open episode comments; ideally the number of replies is displayed as well if known, encouraging users to take a look (#7078)
- Way to see/set streaming payments for that podcast and to send a boost (a donation with an optional comment); see implementation in the Breez, Fountain, Podverse & Castamatic apps as examples; functionality only shown if user has set this up already via settings (#4671)
- Our interpretation of priority of these functionalities (from most to least important): playback control, cover & episode metadata display, shownotes, chapters, sleep timer, bookmarking. Other features are harder to prioritise. We can set out a short survey (distributed via social media) in which we ask users to order all features.
Episode detail screen
To be described. In short: add stuff listed above for the player screen, so that there’s feature parity concerning episode metadata. Improve the design, trying to align it more with the player screen. Important to keep horizontal swiping to switch between episodes as well as key action buttons (play/stream/download/delete).
Episode comments
- Comments are mostly ActivityPub-based replies on an episode (also the X/Twitter and other protocols are supported by the specification, but in those cases we’ll just open the app or website so no UX work is needed there). This feature is based on the
<podcast:socialInterract>tag, implementation requested in #7078. - In first instance, design should consider display the displaying of threaded comments (i.e. nested replies). Links, profiles, etc will be opened in a browser. Due to expected (1, 2) legal requirements for the Google Play store, there should be a way to
- report/flag content; using the functionality should require the user to log in/open appropriate webpage where they log in.
- block & hide a specific user; after doing so, all posts by that user will be hidden (with a notification & option to reveal)
- Of second priority will be the implementation of an interface to reply to comments. For this, the user must have an interface to enter their host (website where they have a URL) and log in subsequently with username & password. For details, see implementation in Mastodon, Tusky, etc.
Sleep timer
To be described. In short: add option ‘end of episode’; consider global setting continuous playback; how to avoid confusion between these functionalities.
Transcript
Review/tweaking of the existing mock-ups.
Chapters
Review/tweaking of the existing screen; possibly add way to access chapter URL (web page related to the chapter topic); way to mark episodes for skipping (#5924); way to view bigger version of chapter cover (#6318).
Value4value (streaming payments & boosts)
Interface to set up connection with payment provider & to set payment defaults per podcast.