Development of On-demand Language Translation App

Technology Stack

  • react iconReact Native
  • Java iconJava
Client img

The Client

This subscription-based news portal contains impactful and current news stories - from long reads to short briefs. It categorizes diverse topics users can hover over and choose from. It brings everything together in a single landing page for easy viewing, from the day’s top stories, business spotlights, past events, newsletters, and paid content to free reads. In addition, bold headlines and sufficient white spaces make reading even more effortless on this platform.

The Challenge

The Challenge

Although the website was up for use and its backend was maintained by the client, the frontend lacked the visual appeal required. The poorly structured UI led to a lower subscriber count. There were several issues related to content flow, color contrasts, footer area, broken links, redirected pages, mobile views, etc.

Moreover, important CTA buttons lacked strong colors. Information hierarchy in the mobile view wasn’t clear either. Things looked cluttered and inconsistent. We had to replace many ‘extra decorative’ elements with just the core ones for optimum viewing.

UI concerns such as these piled on the misery for users. Instead of making things easier to access, the site made it hard for users to get what they were looking for. It was becoming difficult for users to go from point A to B. The client sought Capital Numbers’ help to fix these elements and make the site more likable to readers. Capital Numbers had to boost the UI/UX to increase engagement and subscriptions by re-imagining how users would love to interact.

The Solution

The Solution

We set to work by putting together a team of proficient frontend developers from our pool. Our developers started by unearthing areas that matter most in user journeys like login buttons, pricing, pop-up windows, footer section, social shares, etc. Experience is everything for visitors to convert to subscribers. So, our focus was to deliver an experience that drives users to stay glued to the site.

We proceeded with the development work using React Native. The most significant advantage of using React Native is that it allows developers to reuse code for web, iOS, and Android environments, saving time for compilation and build.

Moreover, it’s easier to fix and reflect changes in React Native apps while they’re live. React Native also offers a variety of native libraries that give apps a native look across platforms. For example, we used the React Native Anchor Carousel library to add a slider effect for web and mobile users to swipe and see stories one after the other. We also used the React Native Poppable library to add critical pop-up windows for users to act on. Besides, we embedded React Native Modal to ensure pop-ups resize correctly on different screens. Some areas had scattered information. So, we added React Native Card View to put together important information within card layouts.

Clear communication was a priority for the client. So, we frequently held sync-up meetings with the client through Slack to exchange a free flow of ideas. Throughout the engagement’s 5-month period, the client got us to custom code various UI elements, which our Agile developers successfully implemented directly to the staging server maintained by the client.

results icon

Results

Because of Capital Numbers’ engagement, the client could deliver a more unified information architecture today. We fixed all pain points like broken links and wrong redirects. Although it isn’t a complete overhaul, it is a visual refresh critical to the client’s growth. The client now finds an increased audience because of the following UX changes we brought about:

Orderliness

A once confusing content flow now has an order with different news sections grouped and organized correctly.

Responsiveness

Our solution is responsive across all mobile screens and browsers, bringing in more traffic.

Legibility

Card UI helped us chunk different stories within card-like boxes - allowing better legibility.

Search

Our JS-powered search bars help users filter out desired news/headlines they have in mind.

Pop-up

Our full-screen, custom pop-up generates more clicks and subscribers currently.

Slider

We changed the hard-coded sliders and made them dynamic to ensure the content presented is always fresh.

Typography

We made the entire site much more readable by replacing the existing Matteo font with Playfair Display font for headlines.

Contrast Areas

We used solid colors for primary buttons like ‘Subscribe’ and ‘Get Started’ to differentiate the primary actions from the secondary ones, which were lacking earlier.

Ornamental Designs

We made cosmetic changes around the pricing page by splitting each package into comparison tables and expanding the costliest plan to grab users’ attention.

High-quality, Bug-free Code

Our high-quality, bug-free code was tested by the client’s backend team and deployed to production without hiccups.

Refining and Restructuring

We artfully customized all code and refined the UI in a way that impressed the client, who left us with positive feedback on Clutch and G2.

Newer Visual Identity

Our visual upgrades in critical parts of the pages paid off well as the client now attracts increased readership, sales, and email opt-ins from both web and mobile platforms.

dowload icon

Download this case study

  • Fill 1Created with Sketch.
  • Fill 1Created with Sketch.

Great Reviews

97 Out Of 100 Clients Have Given Us A Five Star Rating On Google & Clutch

Judy ShapiroCapital Numbers 5/ 5
Jose RodriguezCapital Numbers 5/ 5
Jorge QuinteroCapital Numbers 5/ 5
Will HershfeldCapital Numbers 5/ 5
Katherine MaoCapital Numbers 5/ 5
DeVon FavorsCapital Numbers 5/ 5
Read More Reviews
  • Read Capital Numbers reviews on G2

We’d Love To Hear From You

Get Custom Solutions, Recommendations, Resumes, or, Estimates.
Confidentiality & Same Day Response Guaranteed!

What can we help you with?

Our Consultants Will Reply Back To You Within 8 Hours Or Less

  • Shovan
  • Dibakar
  • Indrajit
  • Avishek
700+ In-House Experts
25+ Awards in the last 9 Years
237+ Clients Worldwide
100+ Five Star Reviews On Clutch, Google and GoodFirms
Attach files Select files from your   or   or 

    Recent Awards & Certifications

    • CNBC
    • The economic times
    • Rise Top

    Step Into Our Development Center