Business Dynamics and Digital Products
Business Dynamics and Digital Products
Novamag, a Startup founded 2016 in Hamburg — Germany have developed a solution (SaaS) that offers to their clients a Software for browser based digital publishings to create authentic, contemporary, and interactive digital magazines, eBooks and ePaper, business reports, online newspaper and newsletter. The software contains custom designs but also templates for the users. Besides of that, they have a range of additional services such as strategy and concept, content creation, research and interview and content optimization.
The first brief we received, before the Kick-Off meeting, was that it must be visible on their website how the digital publications are created. Novamag has considered showing the backend with the frontend in the first viewport, perhaps via a slider. It must be clear how to work in the software.
Novamag, a Startup founded 2016 in Hamburg — Germany have developed a solution (SaaS) that offers to their clients a Software for browser based digital publishings to create authentic, contemporary, and interactive digital magazines, eBooks and ePaper, business reports, online newspaper and newsletter. The software contains custom designs but also templates for the users. Besides of that, they have a range of additional services such as strategy and concept, content creation, research and interview and content optimization.
The first brief we received, before the Kick-Off meeting, was that it must be visible on their website how the digital publications are created. Novamag has considered showing the backend with the frontend in the first viewport, perhaps via a slider. It must be clear how to work in the software.
For full Portfolio-Experience please check out the Desktop Version
Description
Revamp and Redesign of Novamags Website
Role
UX Researcher, Brand Desinger, UI Desinger
Solution
UXR, Redesign Desktop, High-Fi Prototype,
Design Critique and Presentation
Tools Used
Figma, Zoom, Slack, Notion, Google Survey
Collaborators
Hanna Kravets
Dates
August 2023
Research Methods
Secondary & Market Research
Brand Comparison Chart
Lean UX Canvas
Lean Survey Canvas
Quantitative & Qualitative UXR
Target Users
Current and past Clients of Novamag
Marketing and Communication Manager
Media Companies and Publishers
Content Creator
HMW effectively communicate the value and purpose of our product to potential costumers in a clear and understandable way?
HMW display Novamag’s Website with it’s product and services in a clear and comprehensible manner?
HMW improve the content and design of the landing page to better represent the unique value proposition of the software?
Background Research - Research Goals
Gather detailed insights into users perceptions, preferences, and expectations related to Novamags’ website
In-depth Insights
01
Understand the user journey on the website, identifying pain points, hurdles, and areas of confusion
User Journey Understanding
02
Determine how well the website’s content align with users needs, and identify any gaps or opportunities for improvement
Content Relevance
03
Value Proposition
Assess how well the website communicates Novamag’s value proposition, unique selling points, and benefits to users
04
Research Method 1 - Secondary & Market Research
Research Method 1
Secondary & Market Research
2021
2021
Digital overtakes print in Germany
Digital overtakes print in Germany
85%
85%
of the media and publishing houses, struggle to recruit new employees due to an increase to new digitalization.
of the media and publishing houses, struggle to recruit new employees due to an increase to new digitalization.
3,64 BN €
3,64 BN €
substantial revenue 2022 in the digital businesses and surpases sales surpasses print sales
substantial revenue 2022 in the digital businesses and surpases sales surpasses print sales
Research Method 2 - Brand Comparison Chart
Summary:
• We took some important variables from our research and started to compare Novamag main features, their support system, UX Landing Page and the Price Politics with their direct competitors
• This chart gave us a good overview and helped us later to understand potential challenges and areas that might need a work around later
Webmag
Foleon
Publishing One
Research Method 3 - Quantitative User Research
Which Novamag service or function do you use most often?
Creation of digital magazines
14,3% use of templates for other purposes
85,7%
What industry does your company belong to?
Media & Publishing
14,7% from marketing & advertising
7,1% from tourism industry
7,1 % from e-commerce
21,1% other industries
50%
Please state the size of the company
Medium-sized enterprises
35,7% from small businesses
64,3%
Research Method 4 - Lean UX Canvas
01
Business Problem
Not clear how the software can be used on the website and how the back-end is connected to the front-end
This leads to an unclear user experience as users do not understand how to work with the software to achieve the desired results
04
User Benefits
Autonomy and independence
Simple and intuitive operation
Trust and security
Better control over the process
Increase effectiveness and quality
07
What’s the most important thing we need to learn first?
The interactive help guides cover users‘ most common and important questions and meet their needs for support and guidance
Users will actually use the interactive onboarding tutorial, not skip or ignore it.
The interactive onboarding tutorial is found useful and helpful by users and promotes their confidence in using the software.
02
Business Outcomes
Increasing the usage rates on software
Increased sales
Reduced support and training effort
Increased numbers on subscribers or costumers
Increasing costumer satisfaction
05
Solution Ideas
An interactive onboarding tutorial that walks users step-by-step through the process of creating a digital publication. The tutorial could include pop-up tips, visual cues, and interactive elements to engage users and make the process more intuitive.
Visual workflow overview, as a flowchart or infographic, illustrating the different phases and actions of the process.
Video tutorials showing the software in action.
Help guides in the demo version
08
What‘s the least amount of work we need to do to learn the next most important thing?
The interactive onboarding tutorial is found useful and helpful by users and promotes their confidence in using the software.
Survey
03
Users and Costumers
Media Companies and Publishers
Marketing and Communication manager
Content Creator
06
Hypotheses
We believe that the business outcome of an increased number of subscribers or customers is achieved when the user has the benefit of using help guides in the interactive demo version to quickly find answers to their questions while using the software. This will lead to increased demand for the platform.
We believe that the business outcome of increased usage and user return is achieved when the user has the benefit of using an interactive onboarding tutorial to easily understand the software and create effective digital publications. This will lead to increased efficiency and time savings in content creation.
Research Method 5 - Qualitative User Research
Robin Wendt
Marketing Lead - 18yrs. experience
“Behind Novamag is a remarkably agile team with an impressive company culture. As long-time customer, I know this, but it is not reflected in the digital presence, which is a shame.!”
Janine Cohen
Marketing Manager - 6yrs. experience
“I recently wanted to recommend the Novamag software to our customers and was looking on the website for licensing pricing for them. Unfortunately, I did not find any cost details or information about the packages offered”
Sarah Mayer
Agency Owner - 12yrs. experience
“You can create very impressive results without any tech background in a relatively short time. However, you need to understand the system first, as it is a complex software with a lot more functionality than you might think.”
Research Findings:
• In our affinity diagram we sorted out our results from the previous qualitative user research in sections such as the overall demographic insights about the user we interviewed and their business goals and motivations.
• In this phase we also used previous insights from the quantitative research and took the Lean UX Canvas into account.
• Meet Innovative Ingo! Ingo is working in a growing publishing agency as a marketing lead. He identified the need of the digital bridge between print and media.
Conclusions:
• Ingo is going through a process of five stages, where he needs of digital product solution for his business.
• After a frustrating experience he leaves the website without getting in contact with the company.
• Decided to focus on the last two phases of the journey map, as they were crucial for the redesign of Novmags Website
Problem Statement
Novamags software was designed to achieve easily understandable and authentic digital publishing creations.
Our observation reveals that the current landing page of Novamag fails to meet users requirements for clear information and transparency regarding products
and services.
This deficiency leaves potential customers feeling confused and unable to take decisive actions for their businesses.
MVP Statement
• We started to ideate with the Round Robin Method were for each problem, a solution is created, and possible failures as also final solutions are considered. The whole method works cross functional.
• Transferred the ideas in the MoSCoW Grid
Minimum Viable Product that emerges the users and stakeholders needs
Results Concept Testing:
• Sketched Low-Fi Wireframes for Concept Testing
• Main feedback points we collected were positive about the clear information access and the transparency about Novamags references
• Collected the feedback about the Front- and Back-end with us, to display the companies USP in a clearer animation or video how easy the software and its possibilities is to use.
01
02
03
04
Front- & Backend Animation and Screenshots
Showcasing generic results from previous clients' experiences through front & backend animation with hovering dots.
Clear Information and Additional Services:
Providing clear and concise information about Novamags' additional services.
Highlighting Company Values and Culture
Showcasing the company's values, achievements, and culture through visuals and references.
License Options and Target Group
Highlighting various license options on the landing page in combination with existing projects to emphasize the diverse target businesses.
Mid-Fidelity Wireframes and Usability Testing
Plattform
Referenzen
Lösungen
Service
DE
We’re
hiring!
Login
Demo anfordern
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
Lorem Ipsum
Lorem Ipsum
“Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.”
“Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt uLorem ipsum dolor sit amet, consetetur sadipscing elitr, sed d”
Lorem Ipsum Front-End
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolo
Lorem Ipsum Team
Unsere Pakete
Lorem Ipsum Referenzen
Unsere Services
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolo
Lorem Ipsum Back-End
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolo
Software für digitale Publikationen
newsletter
follow
E-Mail Addresse
Support
Help Center
Status
Datenschutz
Impressum
Produkt
Funktionen
Referenzen
Lizenzen
Content
Unternehmen
Blog
Jobs
Über uns
AGB
Willkommen bei Novamag!
Mehr erfahren
Starter
Business
Corporate
Enterprise
“Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.”
“Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.”
Kundenmagazine
Mitarbeitermagazine
Nachhaltigkeitsberichte
Geschäftsberichte
Mehr erfahren
Jetzt Demo anfordern!
Showcasing Insights from the software, along with animations of both the front- and backend to highlight USP
Most important functionalities of the software in the service section - streamline the user's decision-making process.
Expanded the references section to include testimonials from existing clients
Aa
Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt
Uu Vv Ww Xx Yy Zz
1 2 3 4 5 6 7 8 9
Roboto Regular
Heading 1 in Catamaran Bold 51 px
Heading 2 in Catamaran Semibold 47 px
Heading 3 in Catamaran Bold 38 px
Subtitle 1 in Catamaran Bold 26 px
Subtitle 2 in Catamaran Bold big letters 18 px
Body in Catamaran Medium 23 px
Nav Bar in Catamaran Medium 20 px
Caption in Catamaran Medium 18 px
Caption 2 in Catamaran Medium 16 px
Branding
Olivine as our primary color symbolizes the humans mind, Rosy Brown the heart and spirit and the African Violet the love to ourselves. We chose a variable font named Nunito as our typography of choice and chose it because of its rounded edges, that gives a friendly and welcoming look that matches with the Logo I created. The story behind the Logo is simple yet significant. It symbolizes, as in the color choice explanation already mentioned, the humans mind, spirit, and hug from us. It`s imperfect shapes, presents the imperfection of all.
Cadet Grey
909EAD
Charcoal
304156
Robin Egg Blue
03C4C6
Meet Novamag
Welcome to the fascinating journey of transforming Novamags' website into a user-centric digital platform that seamlessly showcases the magic behind creating digital publications with Novamags' software. Novamag is your gateway to a new era of digital publishing. It's time to make your content shine, engage your readers like never before, and contribute to a more sustainable future. Join the Novamag revolution and redefine the way you create and share digital magazines.
User-Engaging Interface
I may now present to you finally our end prototype. Where you can clearly see an animation of the front-end of Novamags product and its possibilities that catches the users’ interest right away. Further down the back end of the software is displayed in a slideshow with feature points to showcase the USP of Novamags product and how easy it is to use.
Streamlining Users Decision-Making Process
The service section displays again more functionalities to streamline the user’s decision-making process. We expanded the references section to include testimonials from existing clients, and designed a slider for the different packages Novamag wants to display more on their website.
Licence and Packages
We also included a team section on the website, to catch Novamag´s Corporate Identity. On the next license page, the user has the option to switch from yearly to monthly prices…
Attracting Clients and New Employees
and some benefits next to the contact form to draw the user’ attention to get more information from the team after sending a contact request. We also edited the hiring page with new pictures of the team that were just shot right in our first week of our project — this gives the website the welcoming feeling Novamag is maintaining to attract new employees.
User-Engaging Interface
I may now present to you finally our end prototype. Where you can clearly see an animation of the front-end of Novamags product and its possibilities that catches the users’ interest right away. Further down the back end of the software is displayed in a slideshow with feature points to showcase the USP of Novamags product and how easy it is to use.
Streamlining Users Decision-Making Process
The service section displays again more functionalities to streamline the user’s decision-making process. We expanded the references section to include testimonials from existing clients, and designed a slider for the different packages Novamag wants to display more on their website.
Licence and Packages
We also included a team section on the website, to catch Novamag´s Corporate Identity. On the next license page, the user has the option to switch from yearly to monthly prices…
Attracting Clients and New Employees
and some benefits next to the contact form to draw the user’ attention to get more information from the team after sending a contact request. We also edited the hiring page with new pictures of the team that were just shot right in our first week of our project — this gives the website the welcoming feeling Novamag is maintaining to attract new employees.
User-Engaging Interface
I may now present to you finally our end prototype. Where you can clearly see an animation of the front-end of Novamags product and its possibilities that catches the users’ interest right away. Further down the back end of the software is displayed in a slideshow with feature points to showcase the USP of Novamags product and how easy it is to use.
Streamlining Users Decision-Making Process
The service section displays again more functionalities to streamline the user’s decision-making process. We expanded the references section to include testimonials from existing clients, and designed a slider for the different packages Novamag wants to display more on their website.
Licence and Packages
We also included a team section on the website, to catch Novamag´s Corporate Identity. On the next license page, the user has the option to switch from yearly to monthly prices…
Attracting Clients and New Employees
and some benefits next to the contact form to draw the user’ attention to get more information from the team after sending a contact request. We also edited the hiring page with new pictures of the team that were just shot right in our first week of our project — this gives the website the welcoming feeling Novamag is maintaining to attract new employees.
Next Steps
• Revamping the website’s structure by creating a new sitemap
• Develop an interactive onboarding tutorial that guides users through the creating process
• Create a visual workflow overview that shows the phases in the creation process
Learnings
The final project at Ironhack’s UX/UI-Design Bootcamp thought me about professional business dynamics who are major for a successful collaboration and any digital product.
Next —>
Next
<—Previous
Next —>