openverse-frontend icon indicating copy to clipboard operation
openverse-frontend copied to clipboard

Show 3d model content in the single result view

Open fcoveram opened this issue 3 years ago • 0 comments

Problem

For the 3D model support milestone, we need to show the information of a 3D model result in the single result view. This view considers a modal and page version.

Considerations

Review the back to results action as modal implementation is still in progress

  • #1266
  • #1361

Solution

Here are two screen recordings with the whole flow from the search results page to the single result view, and the mockups related to the single results views.

Desktop

Screen recording

https://user-images.githubusercontent.com/895819/169101493-7185bbeb-9f77-48d5-81e5-61d8ea895bde.mp4

Mockups

Single result. Modal Single result. Page
Single result : Modal  3D model Single result : Page  3D model

Mobile

Screen recording

https://user-images.githubusercontent.com/895819/169101916-9ffe5a59-152d-45a8-92aa-ceefd640835c.mp4

Mockups

M  Single result : 3D model

Figma file

Figma: 3D model support

Description

On desktop, the modal view wraps the 3D model with the same spacings as the content details, the information below. Whereas on the page version, the content is width: 1000px and height: 500px as discussed before, and the back to search action is a row section placed above the main content that applies to all page views.

On mobile, the 3D model content is the same as the rectangular component displayed on the 3d model results, while all remaining content pieces below keep the current styles.

What do you think of the idea? There might be related comments on issue #1432 as both tickets belong to the same search experience.

fcoveram avatar May 13 '22 14:05 fcoveram