Landing Page

Note: The current design showcases the page's initial structure and does not represent the final design.
Link to the mockup: click here
The landing page will be accessible through the “About” navigation tab and consist of all the important information about the Catalog and Marketplace features.

The page structure:

  1. Header

  2. The Catalog and Marketplace introduction text - both boxes will have the following links: the “launch” button that will redirect the user either to Catalog or Marketplace, and the “Read more” button that will direct the user to the section with more details.

  3. Digital Catalog - this section will introduce the user to all the tabs related to the Catalog. Each tab will have a title, description, the “Launch Catalog” button, and a graphical representation of the chosen tab (e.g., a Tablet Mockup of each tab with an icon related to the topic).

  4. Marketplace
    This section will be dedicated to the tabs related to the Marketplace page. Each section contains the icon, title, description, and the “Launch Marketplace” button.

  5. Quote

  6. What is the Digital Impact Exchange - this is a section reserved for information about the target groups and possibilities for each of them.

  7. The recommendation wizard section will redirect the user to the wizard page.

  8. Tutorials - section with all necessary content in relation to tutorials and new features.

  9. Blog section

  10. Newsletter / contact us section


Catalog and Marketplace Tabs:

You can also view the proposition of the new structure for the Catalog and Marketplace through the prototype. Each tab (accessible from the navigation bar) will represent a different purpose.
The Catalog tab will be dominated with a yellow color pallette and the Marketplace with the blue one to underline the tabs' meaning and purpose. The layout of the tabs and filters is slightly redesigned. The filtering bar’s width is smaller and gives more space for the content of a specific tab.

Please note that the filtering and list pages do not represent a new design; they have a “placeholder” function.