Change Details

====Background This task aims to implement the designs for the `highlights` view on the microsite. Users (treatment group) will encounter these `highlights` when they land on the dedicated `highlights` page, either after: - clicking on an advertisement through a social media platform - or selecting a category from the `highlights` microsite homepage. Designs in this task will focus on UX and visual design aspects of `highlights` which are based on the findings from unmoderated usability tests. ====Description - URL to the `highlight` microsite - [[ https://phabricator.wikimedia.org/T345551 | Home & Category view ]] - [[ https://phabricator.wikimedia.org/T345546 | Carousel view ]] - Ts & Cs, content sources & licences ====Design Includes: - Highlight Title e.g. Nelson Mandela. - Content: Text in English & related Images - Option to view the other 3 `highlights` within the same category. - Homepage with 7 categories; 4 `highlights` under each Excludes: - Branding - Blue links, References [we are limiting the depth of navigation for simplicity] Error states ====Acceptance Criteria TBA ====Test Scenarios # speed of loading images # user experience on different devices # navigation (mobile-first): Home & Category view, Article view ====Open questions - Traffic from the social/paid media ads being redirected to a `highlight` and [[ https://phabricator.wikimedia.org/T343990 | randomising ]] the assignment to the treatment group. - TBA. - Should a user be able to view & navigate to the `longtext` microsite? - No.

====Description **Site Chrome**: Add a header on the category page that will house the microsite's title. The option to include a hamburger menu should be considered. **Close Icon**: Introduce a 'Close' icon ('x') on highlight pages. This will enable users to exit a highlight and return to the home or category page. **Footer**: Implement a footer on category pages only. The footer will contain a fine-print section with disclaimers, terms of use, or other essential information. ====Design ====Acceptance Criteria ====Test Scenarios

====Background This task aims to implement the designs for the `highlights` view on the microsite. Users (treatment group) will encounter these `highlights` when they land on the dedicated `highlights` page, either after: - clicking on an advertisement through a social media platform - or selecting a category from the `highlights` microsite homepage. Designs in this task will focus on UX and visual design aspects of `highlights` which are based on the findings from unmoderated usability tests. ====Description - URL to the `highlight` microsite - [[ https://phabricator.wikimedia.org/T345551 | Home & Category view ]] - [[ https://phabricator.wikimedia.org/T345546 | Carousel view ]] - Ts & Cs, content sources & licences ====Design Includes: - Highlight Title e.g. Nelson Mandela. - Content: Text in English & related Images - Option to view the other 3 `highlights` within the same category. - Homepage with 7 categories;**Site Chrome**: Add a header on the category page that will house the microsite's title. 4 `highlights` under each Excludes:The option to include a hamburger menu should be considered. - Branding**Close Icon**: Introduce a 'Close' icon ('x') on highlight pages. This will enable users to exit a highlight and return to the home or category page. - Blue links**Footer**: Implement a footer on category pages only. The footer will contain a fine-print section with disclaimers, terms of use, References [we are limiting the depth of navigation for simplicity] Error statesor other essential information. ====Design ====Acceptance Criteria TBA ====Test Scenarios # speed of loading images # user experience on different devices # navigation (mobile-first): Home & Category view, Article view ====Open questions - Traffic from the social/paid media ads being redirected to a `highlight` and [[ https://phabricator.wikimedia.org/T343990 | randomising ]] the assignment to the treatment group. - TBA. - Should a user be able to view & navigate to the `longtext` microsite? - No.