The World Through the Lens of Software

Web app

Jeff sent us a wireframe along with an outlined vision of the new platform. Quora served as a reference thanks to its clean, minimalistic, and engaging interface. Target audience is a community of software engineers and people from IT industry who often prefer simplicity and usability over bells and whistles.

The goal has been to improve the following user-flow areas:

• Allow user interactions from the main feed, such as upvote and comment.
• Enable seamless search from the navigation bar.
• Provide easy access to the most popular topics on the left sidebar.

iOS app

We had the freedom to propose a whole new layout for the iOS application. Not only did we strive to achieve consistency with the web app, but our team also wanted to make the app no worse than the most popular podcast apps such as Overcast, Apple Podcast, or Breaker. However, changing user habits is always a challenge. To encourage the transition to a new app, its interface must feel familiar and sleek.

After picking the color palette and fonts, we focused on two main screens - feed and episode view.

Feed

We have explored a few different concepts of presenting content in the main feed.

key assumptions:

• Users have to be able to interact with the episode without navigating to the episode detail view. The three crucial interactions are like (upvote), comment, save for later (bookmark).

Before / After
• The content of the image is less relevant than the title and serves mainly for visual purposes (Thumb allows more natural distinction of subsequent episodes)
• One column feed is better than a two-column feed because the order of episodes is crucial for navigation. For unordered collections such as shows list in various podcast apps, rectangular tiles in two columns layout work better - which is not the case here.
• A cell in the feed should not be too high - the user should be able to interact with at least three cells on a 5.8-inch display size.
• Users should be able to see a progress bar for episodes that’s been started but not finished.

Episode View

The main points of concern in the episode view were buttons placement, content alignment, and information hierarchy. The screen contains relatively long text content and many various interactions.

Key assumptions:

• Image thumb is not required here; we decided to put subtle episode guest image thumb next to date for the sake of coherence with the web version.
• Users should see the episode's topics and can tap on them to see related shows.
• Color selection should make for a clear information hierarchy.
• Related links and download buttons should be visually separated from the save, upvote, and comment features.

We decided to try out Notion as the issue tracker and switch from Jira for this particular project. Ever since, it has become our first-choice project management tool.

Web

As we have been building on top of the existing codebase, the frontend framework was already selected - Vue.js. Even though the main goal was to reorganize the app's layout, the scope included a few new features too. For example, episode classification by topics entailed creating new database entities and respective API endpoints. It took us two sprints to get the app into good shape and sort technical debt. The team consisted of two frontend engineers, one backend node.js engineer, and one senior full-stack developer who worked as a team leader.

Mobile

The UI work revolved around refreshing existing views, and occasionally implementing new ones. In parallel, some business logic required re-implementation, especially the part responsible for audio playback.

To make the player overlay match the industry standard of audio apps, we eventually decided to introduce coordinators pattern for navigation. Ultimately, this decision led to implementing MVVM-C architecture in the whole app to facilitate the new flow.

The new web application has launched in early April, followed by the iOS version hitting the app store on May 27th. Downloads and usage stats that doubled is one thing, but looking at the growing number of upvotes and comments under episodes, it is safe to say it was a good call to refresh the apps.