01

HP - Service news

01

HP - Service news

01

HP - Service news

HP Indigo requested a news platform to centralize company updates across various topics, including service, maintenance, new products, and events. The goal was to develop a well-defined MVP for initial testing, allowing flexibility within certain constraints:

  • Integration with PrintOS: The platform would be part of PrintOS, HP’s internal system for printer owners. TENA has collaborated with HP Indigo and HP Global for over a decade, shaping their interfaces from the first generation of touch screens to cloud-based PrintOS applications.

  • ServiceNow Compatibility: The solution needed to align with the ServiceNow environment to ensure seamless integration.

  • Handling Legacy Constraints: Due to interoperability challenges between new and legacy systems within PrintOS, some news files wouldn’t support direct embedding. In these cases, the platform had to replicate an email-style format, displaying a main message with an attached PDF when needed.

Role:

User Research, Interaction, Visual design, Prototyping & Testing

Industry:

Web news portal

Duration:

2020 - 2022

Overview

I joined TENA Studio as a Product Designer a month before the project started. As part of the UX/UI team, I participated in research, wireframing, prototyping, UI design, and developer handoff.

Challenges

  • User Needs: Floor managers handle various updates—software, maintenance, schedules, regulations—that need to be streamlined into one organized platform.

  • Data Complexity: HP’s extensive printer lineup includes multiple models, versions, and extensions, requiring a well-structured hierarchy to manage large volumes of information efficiently.

My Approach

We conducted research using several methods:

  • Technical News Platform Analysis – Studied different structures to define data organization on the main news page.

  • Existing Information Review – Assessed how updates were currently delivered and their frequency.

  • User Definition – Identified the range of end-users.

  • ServiceNow Training – Understood system constraints and limitations.

Key Insights

  • Lack of Two-Way Communication: Most news platforms function as one-way channels, with no way for users to respond or interact.

  • Floor Manager’s Role: Floor managers receive updates but lack a built-in way to relay them to factory workers.

  • Content Categorization: Information was divided into four groups—Product News, Technical News, Reports, and Enrichment Content.

  • Content Formats: Updates arrived as text, PDFs, videos, and images, requiring clear indicators for format, information type, and related machine when applicable.

Wireframing the solution


To address these challenges, we developed key solutions:

  • News Center Homepage: A centralized dashboard displaying a quick overview of all content types, with clear update indicators.

  • Content Hierarchy: Differentiated content type, format, and relevance for better organization and navigation.

  • Two-Way Communication: Introduced a connection between content creators and readers, enabling interaction.

  • Dedicated Pages for Each Content Type: Defined unique layouts and consumption experiences tailored to product news, technical updates, reports, and enrichment content.

  • Wireframing & Feedback: Created wireframes to test and refine the overall layout before moving into detailed design.

Wireframing the solution


To address these challenges, we developed key solutions:

  • News Center Homepage: A centralized dashboard displaying a quick overview of all content types, with clear update indicators.

  • Content Hierarchy: Differentiated content type, format, and relevance for better organization and navigation.

  • Two-Way Communication: Introduced a connection between content creators and readers, enabling interaction.

  • Dedicated Pages for Each Content Type: Defined unique layouts and consumption experiences tailored to product news, technical updates, reports, and enrichment content.

  • Wireframing & Feedback: Created wireframes to test and refine the overall layout before moving into detailed design.

Wireframing the solution


To address these challenges, we developed key solutions:

  • News Center Homepage: A centralized dashboard displaying a quick overview of all content types, with clear update indicators.

  • Content Hierarchy: Differentiated content type, format, and relevance for better organization and navigation.

  • Two-Way Communication: Introduced a connection between content creators and readers, enabling interaction.

  • Dedicated Pages for Each Content Type: Defined unique layouts and consumption experiences tailored to product news, technical updates, reports, and enrichment content.

  • Wireframing & Feedback: Created wireframes to test and refine the overall layout before moving into detailed design.

Engagement with content

The current way of delivering all of the above info is by email. The user gets some kind of a newsletter with different sections each time. This relationship is one-way, the users have no way to respond to the sender, comment on reports or ask questions about new machine technical treatment. We wanted that both the reader and creator of information will have an open line of communication.



The first step was to “reveal” the creator. We added a profile picture, name, and email address as basic information in addition to a “follow” button. The reader now has all of the info they need to contact the creator in private or follow an interesting publisher.

The second step was to add an engagement area at the end of the article. In this area we placed a few engagement options:

The third step was somewhat unconventional. To expand the line of communication even more, we added a messaging feature. This feature has a few main purposes:

  • Users can talk with creators and comment privately about their articles

  • Contacting the technical team to help with new technical procedures.

  • The floor managers can talk with their colleagues, share information and knowledge, and most important - create connections with others in their field. This specific feature was not available in the previous method of delivery.

Engagement with content

The current way of delivering all of the above info is by email. The user gets some kind of a newsletter with different sections each time. This relationship is one-way, the users have no way to respond to the sender, comment on reports or ask questions about new machine technical treatment. We wanted that both the reader and creator of information will have an open line of communication.



The first step was to “reveal” the creator. We added a profile picture, name, and email address as basic information in addition to a “follow” button. The reader now has all of the info they need to contact the creator in private or follow an interesting publisher.

The second step was to add an engagement area at the end of the article. In this area we placed a few engagement options:

The third step was somewhat unconventional. To expand the line of communication even more, we added a messaging feature. This feature has a few main purposes:

  • Users can talk with creators and comment privately about their articles

  • Contacting the technical team to help with new technical procedures.

  • The floor managers can talk with their colleagues, share information and knowledge, and most important - create connections with others in their field. This specific feature was not available in the previous method of delivery.

Engagement with content

The current way of delivering all of the above info is by email. The user gets some kind of a newsletter with different sections each time. This relationship is one-way, the users have no way to respond to the sender, comment on reports or ask questions about new machine technical treatment. We wanted that both the reader and creator of information will have an open line of communication.



The first step was to “reveal” the creator. We added a profile picture, name, and email address as basic information in addition to a “follow” button. The reader now has all of the info they need to contact the creator in private or follow an interesting publisher.

The second step was to add an engagement area at the end of the article. In this area we placed a few engagement options:

The third step was somewhat unconventional. To expand the line of communication even more, we added a messaging feature. This feature has a few main purposes:

  • Users can talk with creators and comment privately about their articles

  • Contacting the technical team to help with new technical procedures.

  • The floor managers can talk with their colleagues, share information and knowledge, and most important - create connections with others in their field. This specific feature was not available in the previous method of delivery.

Technical pages


Half of the content delivered using the system is technical reports and notes. These technical pages hold updates about maintenance routines, known issues, bugs, etc.The content is delivered in PDF format than can not be implemented as live text. We suggested using a two-column-based pattern that will allow easy browsing and reading of the documents.The users will have an option to download the doc to their pc so they could share it externally with their workers.

Technical pages


Half of the content delivered using the system is technical reports and notes. These technical pages hold updates about maintenance routines, known issues, bugs, etc.The content is delivered in PDF format than can not be implemented as live text. We suggested using a two-column-based pattern that will allow easy browsing and reading of the documents.The users will have an option to download the doc to their pc so they could share it externally with their workers.

Technical pages


Half of the content delivered using the system is technical reports and notes. These technical pages hold updates about maintenance routines, known issues, bugs, etc.The content is delivered in PDF format than can not be implemented as live text. We suggested using a two-column-based pattern that will allow easy browsing and reading of the documents.The users will have an option to download the doc to their pc so they could share it externally with their workers.

UI concepts

HP’s brand is very much recognizable by its blue color on a white background within a light-themed environment. Because the styling we used for the wireframe phase was a good match, we focused mainly on the differentiation of colors and tagging of information.

UI concepts

HP’s brand is very much recognizable by its blue color on a white background within a light-themed environment. Because the styling we used for the wireframe phase was a good match, we focused mainly on the differentiation of colors and tagging of information.

UI concepts

HP’s brand is very much recognizable by its blue color on a white background within a light-themed environment. Because the styling we used for the wireframe phase was a good match, we focused mainly on the differentiation of colors and tagging of information.

Design


HP’s new branding direction is going dark mode. It is refreshing and was fun for us to add more depth to our design. We allowed ourselves to add a big splash of color for each category page to make a stronger relationship with the relevant section on the home page.

Design


HP’s new branding direction is going dark mode. It is refreshing and was fun for us to add more depth to our design. We allowed ourselves to add a big splash of color for each category page to make a stronger relationship with the relevant section on the home page.

Design


HP’s new branding direction is going dark mode. It is refreshing and was fun for us to add more depth to our design. We allowed ourselves to add a big splash of color for each category page to make a stronger relationship with the relevant section on the home page.

Conclusion

The new platform launched successfully with positive feedback from the users.

  • Working on an interface that is a part of a bigger operating system has a lot of constraints. Both the UI and UX has to be consistent with other parts of the system to create seamless navigation through the platform. The challenge was fun to take part in and I had a chance to explore my ideas in different frames of constraints which I believe leads to greater creativity.

  • While designing a new platform within a bigger system, there are some limitations related to phases of development. Constrains like file formats that can not change or be implemented seamlessly were a big challenge which we had to find our path in to come up with a reasonable solution.

  • Management systems such as Service Now have their limitations. We had to juggle between designing with system limitations and highly trained developers that can make magic. This was a fun experience of stretching the frame of limitations together.