Khabar

Khabar

An application that delivers the freshest news to Saudi users
Сontent management

Сontent management

Our client’s request

 image
Client's location: Saudi Arabia

Our client wanted to create a news aggregator platform called Khabar on which everyone could find something interesting. Our task was to develop iOS and Android applications along with a landing page.

To ensure that Khabar always has enough new articles and blog posts, we integrated around 100 news sources and let users subscribe to the ones they nally find useful and entertaining. The purpose of Khabar is to be an all-in-one news platform that lets users quickly learn what’s happening in the spheres they care about without having to go to dozens and dozens of separate sources.

Android iOS News SaudiArabia NewsAggregator

Relevance

It’s been estimated that by 2019 there will be 789.2 million mobile phone users in the Africa and Middle East region. And it’s only natural that once people have mobile devices, they want to have everything the internet offers at the tip of their finger.

Apps like Khabar have a lot to offer. Not only do they let people read news and blog posts whenever they want, but they also let people choose their favorite categories so they only see content they really care about. Push notifications alert users when anything notable has happened, making sure that not a single piece of news gets past them.

Results

Duration:
December 2016 – Present
Team:
Frontend - 2 Android - 2 iOS - 1 UI/UX - 2 DevOps - 1 QA - 2 PM - 1 Backend - 1
Designed UI/UX

We started developing Khabar from mood boards and wireframes.

Our client put a lot of emphasis on minimalism and wanted to avoid any unnecessary details. To this end, we selected light hues that don’t distract readers from articles. The CTA buttons (the only highlighted parts of the page) make sure that users can easily share their favorite pieces. Because the app needed to support both English and Arabic we couldn’t really offer much font-wise, as the readability of Arabic is extremely font-sensitive. To prevent the design from being bland, we added some accents. We agreed that the app would be a white canvas with little touches of color.

As for the logo, we decided to tie it to Middle East-styled ornaments and made it in the form of a decorated Arabic letter “K.”

Developed functional backend

The backend consists of two major modules: a parsing module (which collects news from various sources) and a REST API module (which transfers those news to the applications).

The parser module is based on Scrapy. Every five minutes, it runs a command to parse each separate news resource. All of the data from these sources is listened to and collected by one of our background processes, after which it’s stored in a Redis-based database. From here, another background process takes every new piece of news and registers it in the PostgreSQL database.

In the other words, the parser parses and registers raw data to Redis. Then, while the news is being imported, that data is converted to the necessary format and saved to PostgreSQL. We used two databases to separate parsing and importing, which increases the speed of both of these processes.

Khabar’s full-text Amazon ElasticSearch system operates with the help of Django Haystack.

The second module is an API implemented with Django-REST-Auth. When a new article appears in one of the categories to which a user is subscribed, the user receives a push notification telling them about it. This API makes that happen.

Created a native Android application

We chose the MVP architectural pattern for the Android application. The MVP architecture makes the project’s structure very clean and flexible, helping a great deal with expandability. It’s very simple to make corrections and fixes and to add new features, which is absolutely vital for a product that’s just entering the market. Also, a clean architecture means a higher quality product with fewer bugs.

For connectivity with the REST API, we decided to go with the popular and stable combination of RxAndroid and Retrofit. Сalligraphy helps out with font management. We integrated Crashlytics to track crash analytics, which helps us prevent future bugs and crashes. Google Support libraries make sure that the app works fine on older versions of Android. We used Picasso for the beautiful images added to every article, and integrated GCM for push notifications.

Created a native iOS application

The Khabar iOS application is built on the MVC architectural pattern, which offers several benefits: it’s a very simple system with a unifying vision and a simplified mechanism for debugging. By simple, we mean that it’s easy and comfortable to manage, which is perfect for any mobile app from the perspective of both clients and developers.

For efficient REST API interactions, we used Alamofire and ObjectMapper. SDWebImage was implemented to load and cache images, while TYBlurImage helps with blur effects. For social media logins, we used the Google/SignIn and TwitterKit libraries, and we supported push notifications with the help of APNs.

Implemented features

Khabar allows users to sign up via Facebook, Twitter, and Google+. This also ensures that users can share articles with their friends through at least one of these channels.

Khabar can notify users whenever something happens in a category they follow, such as culture, business, and so on. Users don’t even need to sign up in Khabar to get notifications; they just need to allow notifications in device settings.

Khabar around 100 news sources, pulling articles from a bunch of different fields and making sure that users always have something interesting to read.

Gallery

Gallery
Gallery
Gallery
Gallery
Gallery
Gallery

Technology Stack

Backend

Scrapy
Scrapy
Python
Python
Django
Django
R
REST API
Redis
Redis
PostgreSQL
PostgreSQL
Amazon SES
Amazon SES

Mobile

Alamofire
Alamofire
O
ObjectMapper
R
RxAndroid
Google Support libraries
Google Support libraries
TwitterKit libraries
TwitterKit libraries
Alamofire
Alamofire
O
ObjectMapper
Calligraphy
Calligraphy
Facebook API
Facebook API
T
TYBlurImage
Apple Push Notification Service
Apple Push Notification Service
Crashlytics
Crashlytics
Retrofit
Retrofit
Google+ API
Google+ API
Twitter API
Twitter API
Instagram API
Instagram API
Picasso
Picasso
SDWebImage
SDWebImage

See more case studies

A football news portal

A football news portal

A dedicated news portal that features recent events in the Saudi League Football Club

  • Football
  • RTL
  • News
  • SaudiArabia
Developing an MVP that finds the best Instagram hashtags

Developing an MVP that finds the best Instagram hashtags

A mobile application that helps Instagram users find perfect hashtags for their posts

  • Hashtag
  • Android
  • iOS
  • Instagram