Gesture Interaction Design

Presenters need a hands-free, gesture-controlled solution that allows for seamless slide transitions and real-time audience interaction. This would reduce technical distractions and foster a more dynamic, engaging experience for both the presenter and the audience, enhancing overall presentation effectiveness.

In order to think about what kind of gestures will be used to control in the future, I first analyzed what kind of gestures people will make involuntarily or actively when making speeches.

→ Speakers tend to express themselves by making simple gestures
→ Gestures, whether intentional or unintentional, have some expressive commonalities.

Therefore, in the subsequent gesture design, I also need to ensure that the designed gestures are not illogical and maintain the simplicity and coherence of the gestures

I started by making a simple paper prototype for the testers to try to complete the flow of a simple presentation slideshow. Before starting I handed them a set of gestures I had designed and told them what the purpose was. I observed what kind of gestures they would try to make for progress. I collected feedback and made changes.

Features I tested: Choose slideshow, Move up and down, Start a presentation, Swipe left/right, Start & Pause video, Select part of area, Zoom in/out, Rapid jump to another page, End presentation

During the test, I received feedback that some of the gestures were too complicated, so the tester gave me some suggestions for gestures that could be improved to help me determine the final gesture. However, with the exception of gestures that need to be optimized, they can complete a series of tasks of the paper prototype very fluently

Of course, gestures alone are not enough. The user is making gestures and interacting with the screen, and some feedback is needed to let the user know that the device recognizes it.

So there's echo and semantic feedback. Echo means that when use a gesture to make a corresponding action, the screen will respond with an animated effect, while semantic means that when you make a gesture, there will be an icon of the corresponding gesture displayed on the screen, indicating that the device recognizes that you are making the gesture.

Most of the time I use echo as a gesture feedback. However, only the beginning and end of the slideshow use semantic feedback, which is a more formal notice.

A user flow is a visual representation that depicts the steps taken by a user to complete a task or interact with a system.

The main building blocks of a User Flow diagram include:
1. Start/End Points: Represent where the user begins and completes their journey.
2. Screens or Pages: Each step or interaction a user encounters, such as landing pages, forms, or dashboards.
3. Actions: Specific user actions like clicks, selections, or data input.
4. Decision Points: Points where a user chooses between options, leading to different paths.
5. Arrows/Connections: Indicate the flow or sequence of steps between screens or actions.

In this project, the tasks that the user needs to complete are very simple, and naturally the user flow is not particularly complicated, which is more of a way for me to know where to work hard.

A UI Pattern is a reusable solution to common design problems within user interfaces, such as navigation menus, buttons, forms, or modal windows. It provides a consistent, familiar way for users to interact with different systems.

Because my idea is gesture controlling the process of slideshow, then what I do is a platform like PPT, Google Slide, Figma, and Prezi, but the difference is to add the gesture function during the presentation of the speech, while the above one focuses more on the production experience.

In this project, the interface wasn't that important to me, so I combined a lot of layouts that I saw on similar platforms on the market to create my own.

I've briefly outlined what basic interfaces I'll need for my next project. With the help of wireframe, I can make some simple examples to see how it works.

With the help of wireframes and UI patterns, I was able to build a high fidelity presentation of what I wanted to show during the presentation.

A style guide is a document that defines the design standards for a project, including typography, colors, logos, and other visual elements. So far, the style guide I've made just shows the duplicate elements used in the existing interface. Facilitate future expansion.

Adding people to the video screen is a way to better show how gestures affect the interface in some cases. as well as making the video look less rigid. I originally wanted to shoot green screen footage in a traditional way, but I found a great website called Sam2. Sam2 that can do segment any object now in any video or image. It's very easy to use, and it can track exactly the entire duration of the video with the object of my choice, and you can choose from a variety of effects. What I've chosen here is to add a green background behind the subject, which is a green screen that helps me compose into other videos.

I learned how to use a powerful tool - After Effect, which I have been afraid of trouble before. It's a good starting point.
‍
Although gesture interaction is popular, it has not yet fully entered life. One of the biggest problems is inaccurate identification. I think that if can attack the shell to identify inaccurate problems, this technology can be well used in medical experiments, especially in some sterile occasions.

Overall, I'm very satisfied with the project, after all, I really spent a lot of time to study and make a little bit of meditation. I can realize that this growth has been a great harvest. I think my strength lies in the fact that I have a good grasp of the general situation, and my weakness is that the details are not in place (it may also be a matter of time). If I had more time, I would choose to re-optimize the most basic wireframe, meet up, and then take the design a step further.