Changelog

Version	Date	Author	Comment
0.1	10.05.2023	Samara Dominik	Created, set up basic structure
1.0	10.05.2023	Samara Dominik	Final Version

Table of contents

• 1 About
• 2 Usability Concept Features
  • 2.1 Other AAS-Webclients
  • 2.2 General Features
  • 2.3 Display of AAS-Server and their Assets
  • 2.4 Search/Filter Function
• 3 Design Version 0.1
• 4 Design Version 0.2 based on customer feeback
• 5 Design Version 1.0

1 About

The goal of our project is to enhance the usability design of the current popular AAS-Webclients. To achieve this goal, we compared different currently running AAS-Webpages and researched about important UI-/UX-features, in order to work out the best possible design for our AAS-Webclient. In the second step we will implement our design in our code. This will be an agile process, since we are open for the customers feedback and will add it to our design. The last part on the way to a human orientated Webclient are the usability tests, which are described in the Document TINF21C-UsabilityTests_Team_1.

2 Usability Concept Features

2.1 Other AAS-Webclients

• https://aasrepo.digitaltwin-vdma.org/
• https://v3.admin-shell-io.com/
• https://demo-digital-twin.r-stahl.com/?lang=de When comparing those, already existing, Webclients, one can see, that even those with a more human orientated Frontend, like the Demonstrator from Stahl are still hard to use for an unexperienced user. One loses overview of all Assets very fast and the websites still feel complicated in handling, because there are simply too many possibilities to choose from and too many information all at once to process.

2.2 General Features

• Simplicity: We aim to keep the Webclient interface simple and intuitive, reducing unnecessary functionalities that may overwhelm users. This approach ensures users can easily navigate and maintain an overview of the Webclient.
• Structured Navigation: A structured navigation system will be implemented to help users quickly find the information they need. This will enhance the efficiency of the Webclient by minimizing the time required for users to locate specific features or assets.
• Display of Information: To prevent information overload, we will prioritize displaying the most important Asset-information prominently, while structuring additional details in a logical and organized manner. This approach helps users focus on essential information while maintaining accessibility to comprehensive asset details.
• Minimal Clicks: We recognize the importance of providing users with direct feedback for every click. Therefore, we will change the interaction process to minimize the number of clicks required to perform actions or retrieve information.
• Intuitive Buttons: Clear and easily distinguishable buttons will be implemented to ensure users can easily identify and utilize specific functionalities. This will enhance the overall usability and reduce user confusion.
• Language: The Webclient will be developed in a single language, specifically English, to ensure consistency and ease of understanding for a wide range of users.
• Focus on Functionality: The design will prioritize functionality over visual aesthetics. By keeping the Webclient visually simple and uncluttered, users can remain focused on their tasks without unnecessary distractions.
• Input assistance: To enhance the search functionality, input assistance will be incorporated. This feature will provide suggestions and auto-complete options, assisting users in saving time and ensuring accurate search results.

2.3 Display of AAS-Server and their Assets

To facilitate an organized user experience, the selection of AAS-Servers will be segregated from the display of assets. The "Add Server" function will be prominently placed in the top right corner, allowing users to easily add new AAS-Servers when necessary. Since the assets and their contents are most important for the user, they will be displayed in the center of the page, accompanied by a static sidebar to maintain an overview of all available assets.

2.4 Search/Filter Function

The search, filter, and sort functions will be separated from the asset display to avoid confusion and ensure their visibility. The search bar and filter options will be highlighted to enable quick and easy access to these functionalities, enhancing the user's ability to find and refine search results efficiently.

3 Design Version 0.1

4 Design Version 0.2

Asset-Display when Server is already connected

View on the filter functions

Comments on changes

• We wanted to remain a greater overview about all the assets, even if one asset is already opened, which is why we have added a static sidebar that shows all Assets.
• Since there was no space on the side anymore, we moved the filter and sort functions to the top- this also made more sense, since such functions are often at the top of common shop-websites.
• We created the design of the detailed display of an Asset. The information should be structured, according to which technical area they belong to and sorted from most important and frequently needed information at the top, to less frequently needed information on the bottom.

5 Design Version 1.0

Selecting a Server and display of his contents

Asset View

Filter and Search

Build Version

Comments on changes

• We moved the filter and search functions again, to make the page look even more structured
• According to customers feedback we changed the filter-for-year function in a sort by year function, which is also why its design changed
• One can search for manufacturer, but also can look through all manufacturers in a list, which ensures, that the user can always find, what he wants, even if he cannot remember the manufacturer name while searching
• In the search field the user gets now suggestions according to what he types in, to help the user find what he wants even faster
• Both, when clicked on a server and when clicked on an Asset, the background of the Server/Asset field is coloured to help the user distinguish between chosen Servers/Assets and the others.