Glossy and Transparent Elements in Mobile App Interfaces

Transparency – is an effect that works well both on a large and small screens. It is skilled in creating contrast and firm foundation for navigations, control centers and content, providing them with solid layouts. It is also able to preserve all the beauty of background embellishments and spectacular images that generally has a slight blurred touch.

In addition, you can easily experiment with levels of opacity in order to achieve various effects, for example more light-tight layers add glossy and polished touch to an interface while almost translucent canvases add feeling of delicacy and subtlety. Anyway gauzy backgrounds allow to spice up almost any interface with an elegance and sophistication, furnishing components with a more smooth and flawless look.

Today we are going to take a gander at various exquisite application interfaces that shine with a refinement of low opacity layers.

Glossy and Transparent Apps Examples

Mobile Portfolio by Alex Bender looks exquisite and polished. Inspired by iOS7, designer took all the best of a new redesign to give the interface a cohesive feel.

Mobile Portfolio iOS 7 Style by Alex Bender

Recipe app by Ste Ui. Designer ably utilizes a blurred yummy photo background to set a proper mood and effectively accentuates semi-transparent dark menu items made in a lovely ribbon style.

Are you looking for WordPress Theme?

Get Startup Framework for WordPress now!

recipe app by Ste Ui

Extranet App for tutors has a smooth and slightly greased appearance. Circular white functional components with a low opacity wonderfully complement illegible image background.

Extranet App for tutors

New Music App by Amit Rai has a subtle control panel that certainly evokes comfy feelings. An elegant narrow type in conjunction with white bold icons gives the UI a delicate touch.

New Music App by Amit Rai

iOS7 Theme by Patrick Cabral – The concept features a soft opaque quite advanced navigation system with a great deal of helpful information.

iOS7 Theme by Patrick Cabral

Weather widget by Piotrek Sliwa easily conveys a warm experience. Shot of a spectacular sunset nicely cooperates with strong white icons, sharp type and slightly transparent blocks.

Weather widget by Piotrek Sliwa

Timers by Marcos Paulo Pagano. An interface skillfully heightens sense of time, providing owners with comprehensive visual tools. Outline circular components together with frosted “Add” buttons lovely stand out from an abstract unfocused image.

Timers by Marcos Paulo Pagano

App v.2 by Dmitriy Haraberush willingly familiarizes user with a weather forecast by means of a neat, sophisticated content box that includes slightly transparent dark background and contrasting white text.

iOS7 Weather App v.2 by Dmitriy Haraberush

Activity Tracking App Concept by Alexander Zaytsev demonstrates an organized flow of data that are non-intrusively split into rectangular blocks. Light content boxes are nicely contrasted to dark blue obscure background.

Activity Tracking App Concept by by Alexander Zaytsev

Weather App by Jan Erik Waider includes a lot of gentle circular elements that play both decorative and functional role. Huge almost transparent circles in a header beautifully resemble sun glare.

Weather App by Jan Erik Waider

iOS 7 Control Center Redesign by Sam Nissinen. Designer completely ditches a skeuomorphic design and ably embraces white and green color palette that rejoices onlookers with a strong organic atmosphere.

iOS 7 Control Center Redesign by Sam Nissinen

Code Name: Switch by CreativeDash has a photo-based interface on which you can find appetizing images that are nicely bolstered by elegant translucent dark captions.

Code Name Switch by CreativeDash

‘Cel˚C us’ weather App by Ryan Jeon wonderfully showcases weather conditions by means of an elegant dark blocks with low opacity on a spectacular nature-inspired background.

weather App by Ryan Jeon

Photo Play Pro App has an advanced and quite coherent interface with a bundle of helpful tools. Toolkit with a translucent background is compactly arranged along the right side.

Photo Play Pro App

Juventus mobile version by Ammar. Black, white and yellow perfectly cooperate with each other. A gauzy stripe layout helps to bring football personality out.

Juventus mobile version by Ammar

iOS7 Simple Music Player App by Kreativa Studio has a modern and stylish color palette. Designer leverages a soft mint coloring for displaying a progress and highlights active components.

iOS7 Simple Music Player App by Kreativa Studio

Marrakech by Ismail MESBAH is a restaurant-related app that has a quite comprehensive design. Enormous circular icons perfectly stand out from an appetizing heavily muted image background.

Marrakech by Ismail MESBAH

App by Rodrigo Alberto Cavazos is nicely brightened by garish color scheme. A pink diaphanous caption wonderfully accompanies picturesque urban background.

App Design - Pediatrics by Rodrigo Alberto Cavazos

Dreamy weather by Marek Cina. Light transpicuous data blocks with a delicate white and black type fit quite well with a night dreamy theme.

Dreamy weather by Marek Cina

Just Weather App by LEX NAU has a rather intuitive and apprehensible interface that depicts relatively huge weather icons and refined panel with a weather forecast.

Just Weather App by LEX NAU

Weather iPhone APP by DrawingArt is based on a grid layout that spiced up both with glossy and glassy effects. Regular white icons and simple font look prominent and conspicuous on such a patchy canvas.

Weather iPhone APP by DrawingArt

Citizen.tv by Alexandre Protikhin. An app design is supported by a stripe layout that is filled with professional images. Each line has a neat caption that is placed on a translucent bright background.

citizen.tv by Alexandre Protikhin

Transparent Wireframes by Zeki Ghulam looks very “thin” and delicate. White color harmoniously and rather distinctly juts out from an almost transparent canvas.

Transperant Wireframes by Zeki Ghulam

Calendar by chocolatina (Shoko Oyamada) produces positive and cheerful vibrations. Bright riot of colors naturally complement casual typography with a subtle shadow and semitransparent boxes.

Calendar by chocolatina(Shoko Oyamada

Peach Me – My Profile by Rob Davis. Designer wonderfully combines together blurred background, frosted buttons and several transparent circular elements that give the UI an appealing design.

Peach Me - My Profile by Rob Davis

WEATHERIA by First Draft Studio. Designer employs a set of marvelous bright nature scenes that serve as a good basis for dark limpid background with climate symbols.

WEATHERIA by First Draft Studio

Reflection

Although, at first sight, it seems that background with a low opacity leads to a dearth of clarity of content. Actually, if an effect was executed properly and designer was able to achieve a balance, widget with a transparent layer won’t suffer from a lack of readability. Moreover, playing with a level of opacity you can effectively control distinctness and sharpness of content.

Use our comment section to tell us what do you think about making widget background “thinner”?  When and why do you implement such effect?

Nataly Birch

I'm an internet entrepreneur and an amateur web designer and developer from Sevastopol. In my spare time I read books, play board games and volleyball.

Newsletter

7 Comments
  1. Jump Wong Sep 22, 1:27 pm

    Great collection of this kind of design
    Thank you

    Reply
    +2
  2. Marcel Sep 22, 1:30 pm

    Not a single word on Android in this whole article ??
    Keep on dreaming that iPhone is the only smartphone…
    For your reference,current smartphone sales in Western Europe:
    18% iOS, 72% Android, remaining 10% Windows and BlackBerry.

    Reply
    +5
    • James Cliburn Sep 22, 6:58 pm

      Marcel has a point in that there are plenty of examples on Android interfaces that utilize transparency, even glossy elements. I use an iPhone but I also design for both platf

      Reply
      0
      • James Cliburn Sep 22, 7:01 pm

        … Didn’t let me finish.

        Marcel has a point in that there are plenty of examples on Android interfaces that utilize transparency, even glossy elements. I use an iPhone but I also design for both platforms, as I’m sure many UI designers ahead of us do / should.

        Reply
        +7
        • Teagan Sep 23, 6:00 am

          While my only devices are Windows and Android, I can definitely say that the iPhone does have a very polished appearance that exudes quality which the majority of Android devices lack. Even the S4 (I bring it up because of its competitive market position) is plastic-y and not as attractive. It is true that Android apps can be just as beautiful, but I can totally see why Android phones are losing the mockup battle.

          Definitely make your apps beautiful regardless of platform, but don’t be surprised if they present better on an Apple device!

          Reply
          +5
  3. david wright Sep 23, 1:21 pm

    Very latest designs all post you have to share i am inspire to see that and i appreciate for you thanks for sharing!

    Reply
    +1
  4. Hemanth Malli Sep 24, 4:23 pm

    Very good collection!! Mobile App designs look good. Nice share !

    Reply
    +2

Leave a Reply

*
* Minimum length: 20 characters