Magine TV is a Swedish TV streaming network which is also available on the German market with multiple apps. With the creation of the new exclusive PS4 app Magine expanded its range of products. Simultaneously the other apps, amazon TV, web app and all touch apps were updated and got the same concept and design.
I was responsible for the whole UI Design of all product apps and the creation of the new key visual. And also helped to solve some UX issues. The challenge was to design for surfaces and products that aren’t conventional online platforms.
One Gist of the big screen design was the design of the key visual that pulls through the whole app surfaces. The challenge was to create and design the apps in order that the same functionality and concept was guaranteed to the user no matter what controller and device are used. Also, it was important to design every element, that they don’t disturb the users in their TV experience but rather support and improve them.
Magine TV provides a big range of colors. The color red offers a visual destinction to it’s direct competitors zattoo and waiputv. The other colors are there to give every section it’s on color code.
Primary
#FA0046
Primary
#FA0046
Primary
#15D8C6
#FFFF00
#451FA3
A special offer was acquired together with PlayStation for their customer's and is placed in the focus of the package overview. Each package got a unique color variation of the key visual.
The gist of the big screen app is the player. It’s possible to switch between channels or search in specific view through all channels. The programme will not be disturbed when it’s not necessary.
The web app is the platform with the highest traffic and therefore the most important product field. The main aspect was to rebuild the product with the focus on the player. Above that various new section like the media library and catch up were designed.
The final issue forms the touch apps of Magine. Designed and adjusted for the distinct need of mobile devices. The small space that was provided through the mobile devices was optimally used to created necessary features.
Magine TV is a Swedish TV streaming network which is also available on the German market on various platforms and also a web application. One important point was the permanent improvement of the website, on a desktop, tablet, and smartphone. Further, there were new upsell options designed for the product.
Newsletter, Banner or Facebook Post, it was my responsibility to work together with the marketing team to fill this channels or create new business opportunities, like the white label EPG. All UI decisions lay in my responsibility. Through the adjustments of marketing relevant channels, it was able to increase registrations and sales, thereby the companies KPIs could be achieved.
Magine TVs signal color is red. All important CTAs and the advertising of the main product are displayed in this color. Due to cultural distinctions, the color green is taking this task for the Swedish market. The blue color is a supporting color for both markets.
Primary
#FA0046
Secondary
#29B6F6
Tertiary
#71C2AE
The main task of the website is to convince users to register. The user is convinced on various pages with different reasons to become a customer of Magines product. The website is built on a modular system which enables the possibility to place any module on any page and is easy to fill with content.
There are various important pages of the website with a different area of responsibility. For example, the homepage conducive to explain the service to potential customers. The channel page promotes the content and the channels itself to the user.
All modules are able to display on any device.
Important modules were consistently improved and advanced through multiple iterations, thereby to fulfill the marketing KPIs. All iterations were verified through A/B testing.
By implementing this section after the registration of new users, it was able to increase the sales numbers. Special events such as Olympia or Christmas got a visual adjustment.
The whole concept together with the UI of this page got edited. The focus now lies on the advertising of the main products basic and premium. This way it’s easier for the customer to compare the packages with each other. The sales improved by this changes.
Creation of cross-cutting marketing and business relevant advertising material on different media, such as a newsletter, banner or a white label EPG which can be resold to business partners. There are two possible views for the EPG. One compact version of the current TV schedule additional with the TV highlights of the day. The other one is the detailed version for all yet airing shows of the day. The design of the EPG is easy to adjust to the brand guidelines of the partner.
A new e-commerce webpage for an important Siemens retailer was created. Together with a landing page that promotes special events, services etc. of the retail store. Both websites form a consistent image. The new brand design of the store was implemented and advanced for the online environment. The design was adapted into the clean and reduced UI design of the Siemens world. Special attention was laid on to SEO aspects.
I was responsible for the development of the online shop. In collaboration with the lead designer, a consistent visual online brand was created. Together with the concept team, I elaborated a new filter principle.
Specific brand colors and font were provided from the print design. For the web use more nunaces of the colors were created.
The pages are built on clean and simple modules. The main design aspect is the product pictures which are displayed in various executions together with the CTA button.
For a detailed search result it’s possible for the user to optimize the search. Additionally the filter module can be blend in or out depending on the need of the user. The user is also able to quickly recognise the efficency class and brand of the product.
The product detail page contains a strong CTA. Siemens product highlights are displayed and detailed explained in an own module to the customer.
As part of the new store opening an especially therefor landing page was created. It’s got a strong visual language through the tile and parallax design.
To give Aperto's new profile a well rounded look, the agency got a new and responsive website. Bigger images, appealing texts, an easier navigation as well as compress the content to the essential gave the website a modern and fresh appearance. Next to cases and Aperto's range of services, there can be found whitepapers by which Aperto shares their knowledge with the user.
I was responsible for designing whole module concepts up to the implementation of the final design. My work included image editing, creation of mobile and tablet views, mockups for the keyvisual, 3D-artworks as well as the creation of design templates for building the whitepaper in the new look of the agency.
To keep the number of the template low for this project the focus was to leave it with three main templates and work with modules that can work for every section or just be suitable for a specific case. With this workaround, specific modules can be edited instead of a various number of templates.
Aperto provides a clean and minimal color plate. The black color transmits together with the white a luxurious feeling. Thereby, that the green is the only real color it gets a special visual attention from the user.
Accent
#99CC00
Primary
#212121
Secondary
#444444
A variation of modules is available to advertise each case depending on the required need, especially for the highlight case studies. Its possible to switch between cases without having to go back to the work overview page. Likewise, the tag module provides the possibility to search for reliable studies.
Modules of the home and case detail page were used to build and fill this pages. There are a few modules designed to fulfill specific needs of some pages. Like the blog module, that enables it to download knowledge papers.
A specific grid for the teaser module was design to display these without any problem on all devices.
All existing knowledge papers got a new and cohesive look based on the created web design. Additionally to the redesign, a print template for future papers was created. Thes knowledge papers can be downloaded as a PDF on the blog page.
Hi, I’m Marina Neff. I’m passionate about what I do, and I love to help people. Nothing is more fulfilling than being part of a team with similar interests, and an organization that values its employees. I have been working for 5 years as an User Interface Designer. During this period I had clients in fields of NGO, Banking, Public and famous brands such as Siemens, Rossmann, and MAN. For the last two years, I worked for the TV streaming start-up Magine TV. Thereby I had the opportunity to work in a consumer-focused field.
This website is optimized for desktop or tablet view. Please resize your browser or view it on another device.
This website doesn’t support this version of your browser. Please use the newest version or use another browser.