2018 | twenty weeks
My master thesis project that intended to further develop the interactive video product Smart Video. The outcome is destined for the companies in need of Smart Video as a service. With Smart Video’s technology and main idea as a foundation, the final concept can be seen as a premium service built to streamline the experience for the three user groups; developers, operators and customers.
The Shoppable Video
This is what Smart Video is all about. With the shoppable video, the final outcome of the service, companies turn their videos into interactive online stores. The shoppable videos are created in the online software Creative Tools and consists out of a player on top with the bar underneath, on which the cards rolls by as the video plays.
The first step of producing a shoppable video is to provide the operator with content
The operator modifies the content and returns with a demo of the shoppable video for the customer to verify
The final result is being delivered for the customer to implement on their site
A follow-up dashoboard provides the customer with important data on each published shoppable video
Create New Project
The process of creating a new project is built in steps that can be navigated in the vertical bar on the left. The user starts in “About” by describing the project in short terms to tell the operator how the final result expects to turn out and state some guidance in how to regulate the flow of cards. While all input is mirrored in the summary to the right as its being added for a better overview of the project.
Moving on to the following steps, the user provides the operator with the video and the products that are going in the shoppable video, before customizing the look of the cards to fit the context of the end product.
Although it’s possible to get a quick look of how a collection is performing on the home screen, in-depth data and statistics can be found by switching to the follow-up view in those project pages that carries a live project. From here, it’s possible to view a detailed dashboard on how the project is doing in terms of traffic.
The follow up presents the most usable data for the user to analyze, including CTR, total views, total clicks, device ratio, views per day, view completion and clicks per product. By changing display mode in the bottom right corner, it’s possible to see how a project has been doing for a certain time span and any data can be exported by clicking the PDF-button on the top of the dashboard.
The Design Process
“What we do is that we inspire our customers by showing them a Smart Video that is made up by their own logotypes, content and products, to make them go; ‘god, this is so good’. And then, let’s say it takes us ten days to design a native advertising campaign, the actual video doesn’t have to be delivered until day ten. Customer
“When it comes to the video you receive, I would like to see some kind of feedback section. That they could comment on it in connection to the demo. For them to point out stuff they would like to change or if there are product switches that needs to be done. Like ‘can you fix this?’. Developer
“I mean it can turn out to anything. Not everybody has the knowledge to modify CSS and therefore it might be good to set boundaries. Although, it might be possible for them to decide on themes for the player itself, if someone is looking for that option in the future. Operator
Component Focus Group
One of the key elements of the service is the action of creating a new project, meaning that the user has to provide the operators with the data they need to produce the shoppable video. As there are many possible ways to upload this data, key stakeholders were collected to discuss what components that are best suited as upload interactions.
A wireframe prototype was constructed to investigate the overall structure of the interface and the placement of the components. This prototype was thereafter refined in three iterations, based on usability testings and feedback from experienced designers. At last, the final suggestion was designed on top of the wireframe, to match the already set look of Smart Video.