Windows 11 Design Contest (3 place)
This is a three-week challenge between winners of the Android
Design Contest, dedicated to designing their vision of the
Windows 11 native Telegram app.
The task was to design the main Telegram app screens following the newest guidelines of Windows 11 and using the latest
approaches of that platform (e.g., blurred backgrounds). Also, designed mockups and functionality should be consistent
with the Telegram apps on other platforms.
(Team)
Natasha Karpovich / Team Lead
Andrey Klimenok / UI Designer
Liudmila Kazakova / UI Designer
Julia Kudinovich / Graphic Designer
(Link)
Look project in Figma
(Chats)
We paid special attention to chat components keeping in mind
the cognate features of the Windows 11
Working on the Telegram app design we were using the new Fluent emoji design set that was first previewed
ahead of 2021's World Emoji Day and was included to the Windows 11 November 2021 update.
We have focused on each message type from simple text messages to complex combinations of
diffrent message types. The prepared UI mockups shows audio and video mesages,
media, files, shared location, and present attachment uploading components.
- files / media sending -
- stickers, emoji and gifs sending-
(Chats info)
The chat details screen saved highly similar view to its view on
other platforms
We user the Windows 11 pattern for setting screens to make the caht deatils screen maximum familiar with the Windows’s nativity and theTelegram’s identity. The screen architecture and content is the same as used on
other platforms: the chat bio, lists of members, media, files, links, voice messages, GIFs,
and also the list of available chat actions.
(1 to 1 calls)
Audio and Video calls design is inspired by Mica Blur
One of the key Windows 11 identity attribute is fluent materials, like Mica Blur. This blurity we used to make
audio and video call screens more deeper and beauty. As a primary UI architecture reference we choosen
the last version of Telegram app for MacOS.
(Group calls)
Group calls mockups includes the list of participants
and support different grids
The group call view is devided into two columns: the left one is video area that takes 80% of the screen
and contains video blocks, the right column is the participants list. All call menagement elements designed
by the classic Telegram’s pattern and fixed on the top and bottom screen sides. The user can see them if move
the cursor on the screen. The actions becomes hidden automatically after 3 sec of user inaction.
The user can seecommon information about other meeting members: their names, camera
and microphone status, is the member speacks or not. Also, the user can pin any participant video,
so that the pinned video takes full video area.
We are available for new projects!
contact@heapix.com
Let’s create something special together
Look this project in Figma
Subscribe to follow our projects and other news:
Behance: @heapix-design Dribbble: @heapix-design Instagram: @heapix.design
