Entourage - From design to code

Ali benabbes

Fullstack Engineer
Product Designer
iOS Developer
Cloud Firestore
Figma
Flutter
Node.js
Xcode

My role in this project :

As the lead developer and only designer, i was responsible for taking product features from conception to development and deployment.

As a Designer

I collaborated with the product owners to define hight-level requirements, list all the features and setup a strategy; Producing High-quality deliverables as UI Screens; user Flows, and prototypes at various levels of fidelity. Moreover I was responsible of preparing all deliverables for Developer Hand-Off.

Entourage Figma design File

As a Developer

I was responsible for taking the product from an approved prototype to a fully functioning app deployed on both iOS and Android. Therefore my involvement in selecting the Tech Stack, developing the Front-end as well as the Back-end, and handle services deployments as a DevOp.

Development Process - Flutter

Technologies used :

Tech Stack

  • Flutter for cross platform development.
  • GetX and Provider for state management.
  • Firebase, Mongo DB.
  • Algolia for indexing and search.
  • Spotify API , Apple Music API, TMDB API.
  • Sentry for flutter.
  • Google analytics, firebase Crashlytics ( added on client request ).

Design & prototyping tools

  • Figma.
  • UX - FlowMapp.
  • Miro.
  • Principle.

Collaboration tools

  • Notion
  • Slack
  • Google Meet.



About Entourage :

Entourage is a cross platform (iOS, Android ) app enables their users effortless discovery instead of spending time struggling to find new favourites be it : Music, TV shows, Movies, and Podcasts. Moreover The app allows to share those favourite old or new with your family, Friend, or people around the world.

Home Feed in light and dark mode

How it works :

Users can use entourage as a tool for a convenient effortless media discovery such as Movies, TV Shows, Music and Podcasts curated specifically to their preferences; it does so by tapping into the vast data bases of Third-party providers like TMDB, IMDB, Spotify and apple music to pull users favourites and present them all on one platform. Users can enjoy the Social media features of entourage where they can share, rate and request media recommendations from their Entourage with the abilities to comment, like and Tag/Mention user across the app.

Entourage Target audience :

Entourage has a broad audience which means it targets multiple types of users at once : Music lovers, Movie Fans, TV Show enthusiasts and podcast listeners.

Background :

Entourage is a small Startup based in Florida,USA with the core idea of facilitating media discovery through the use of technology; Avoiding the waste of time on Friday nights when you have no idea what movie to watch, or those many gym sessions when you are sick of your entire music library. With this platform, those days are over.

Key Features :

  • Third-party api integration to enable Catalogue search across : Spotify, Apple Music, TMDB and IMDB.
  • Real-time news feed updates when posting.
  • Ai powered algorithms to recommend Music, movies, TV shows and podcasts.
  • Indexed search for users, posts and recommendations.
  • Advanced Caching solution to decrease outbound requests.
  • Push notifications.
  • Rating Recommendations ( posts ) system before publishing.
  • Request recommendations.
  • Real time Likes, comments and mentions with push notifications.
  • User Auth & social logins with : Apple, Google, FaceBook.
  • User Media preferences selector.
  • User profiles with followers and following.
  • Listen-Now and Watch-Now to easily redirect to where to listen and where to watch the media.

The challenges faced Designing and developing Entourage :

The first challenge we faced for entourage just after setting the project goals and strategy was: how to design an app that looks good and speaks to a wide audience yet is easy to use while packing tons of complex features.

While the design phase was a challenge, a much bigger challenge was during the development phase where we had to carefully choose a tech stack that can answer to all the key features keeping in mind, user real-time updates, inter-operability, third-party integrations, Scalability, Analytics, Backup and migration, caching, operation costs and time frame.

The Results ⭐

A simple UI With good UX and a loved iOS / Android app:

While doing research, we encountered some challenges yet we were dead centred on delivering a simple UI focused on ease of use.



Post recommendation 3 step process
Request recommendation process
Explore recommendations - Music - Movies - TV Shows - Podcasts



Watch Now - Listen Now in both light and dark mode



2021

Partner With Ali
View Services

More Projects by Ali