Posted by the Android staff
As one of many largest home streaming and digital content material providers in Japan, U-NEXT is at all times on the lookout for new methods to attach its customers to their favourite content material. In only a single software, the platform hosts an in depth library of over 1,200,000 titles, starting from motion pictures, anime, and reside streams to manga, magazines, and e-books.
At all times on the lookout for methods to enhance its UX, U-NEXT not too long ago turned to the rising market of giant screens and foldables, which incorporates units like Android tablets and Chromebooks. Right here, U-NEXT engineers noticed a possibility to create a greater method to view content material by specializing in what makes these units particular. For instance, higher multi-window help on bigger screens may supply a extra visually wealthy UX, whereas an improved foldable UX may higher mimic the expertise readers get with a conventional paperback.
However some customers bumped into bugs whereas utilizing the U-NEXT app on these bigger and foldable viewing codecs. For example, the app would typically cover necessary buttons when customers opened U-NEXT on bigger screens, forcing them to go looking the web page for these navigation instruments.
To optimize a UX overhaul and higher help these codecs, the U-NEXT staff tackled the mission in two phases: take away any current bugs, then add the options that its large-screen customers would profit from probably the most.
|
Clearing out the bugs
To repair the visibility difficulty for necessary in-app navigation buttons, U-NEXT engineers used a ConstraintLayout to set constraint boundaries. These boundaries prevented UI parts from being pushed off-screen whereas guaranteeing they’re at all times oriented appropriately, irrespective of the display screen dimension.
U-NEXT’s software additionally didn’t at all times show correctly on giant screens. For instance, pages displaying browsable video lists sometimes include a header and a curated checklist of content material. These lists are speculated to occupy a lot of the area on the web page. However on giant screens, the headers occupied probably the most on-screen actual property, making video content material tougher to navigate. The U-NEXT staff resolved this difficulty by proscribing the width of the header picture on giant screens, giving the checklist more room and making searching simpler for large-screen customers.
When customers view books on the U-NEXT software, they’ll faucet the display screen to disclose a horizontal scrollbar that lets them rapidly and simply navigate their place within the textual content. However when customers tried to entry this navigation device on Chromebooks, it wouldn’t seem on the web page.
“Initially, we used SystemUiVisibility to find out whether or not a Chromebook was full-screen when a person tapped it,” mentioned Tomoya Miwa, principal engineer at U-NEXT. “If SystemUiVisibility detected it wasn’t full display screen, it’s speculated to show the controller. Nonetheless, this listener isn’t known as on when SystemUiVisibility is modified on Chromebooks, so the controller couldn’t be displayed.”
This meant U-NEXT needed to change how they handle the visibility of the controller when SystemUiVisibility adjustments on Chromebooks. After this bug repair, the appliance would cover and show the controller on the identical time when the display screen is tapped on a Chromebook, resolving the difficulty for these customers.
The final bug U-NEXT devs tackled was one which quickly disrupted video when customers folded their gadget throughout viewing. Folding a tool whereas viewing content material is meant to be seamless, however the computerized deletion and recreation of the Exercise whereas altering a foldable’s predominant show to a folded show prompted movies to momentarily reduce out.
As a substitute of letting Android deal with these configuration adjustments routinely, U-NEXT builders modified the app to deal with them manually. Utilizing onConfigurationChanged(), the staff overrode the change and prevented the UI parts from routinely being deleted and recreated, letting the app protect them and forestall any viewing interruptions.
Making probably the most with extra type elements
As a part of its function overhaul, U-NEXT changed the standard navigation bar with a navigation rail, which U-NEXT engineers anticipated would considerably enhance the person expertise.
“Reachability is a vital issue in the case of curating snug person experiences,” mentioned Tomoya. “With a conventional, horizontal navigation bar, it makes it tough to succeed in the buttons within the center. With a navigation rail, it turns into a lot simpler to succeed in these buttons.”
 |
Subsequent, the staff enhanced help for two-page spreads when customers considered any e-books content material on foldables. Apps sometimes show a single web page when units are oriented vertically on foldables. However as a result of most foldables supply loads of room for a double-page view, U-NEXT builders wished to make sure customers would at all times see a double-page unfold whether or not in portrait or panorama orientation—even when the gadget was barely folded.
The U-NEXT staff additionally included some smaller, quality-of-life updates to make the person expertise for big screens and foldables even higher. This included including higher help for Google Play in-app billing on giant screens and optimizing picture-in-picture viewing.
 |
Android help makes optimization simple
The U-NEXT staff was stunned by how simple it was to optimize its app for big screens and foldable units. Due to Android’s developer sources, U-NEXT was in a position to enhance content material viewing on its app, throughout units, whereas additionally minimizing effort and time.
“It’s not that tough,” mentioned Tomoya. “Introducing the navigation rail was comparatively simple, and foldable help usually isn’t exhausting so long as your app is suitable with primary display screen rotation.”
Since updating the U-NEXT app to raised help giant screens, pill installations have elevated by 1.5X. Moreover, the watch time from customers on giant display screen units jumped by greater than 10%.
Trying ahead, the U-NEXT staff plans to maintain increasing its app’s giant display screen capabilities by enhancing mouse and keyboard compatibility, introducing checklist element view to enhance search performance, including larger help for tabletop mode, and implementing drag-and-drop options to make content material sharing simpler.
U-NEXT is worked up to see Android add extra sources to its giant and increasing checklist of documentation, together with the not too long ago up to date Materials 3 library, which can additional assist help the rising variety of customers with giant display screen and foldable units.
Begin optimizing for big screens at the moment
Extra individuals are utilizing giant screens, foldables, and different up-and-coming type elements. Study how one can higher help your customers on these units with examples from Android’s Massive Display Gallery.
