联系方式

  • QQ:99515681
  • 邮箱:99515681@qq.com
  • 工作时间:8:00-20:00
  • 微信:codinghelp

您当前位置:首页 >> Java编程Java编程

日期:2021-12-08 10:56

CS3483 Multimodal Interface Design

Assignment

Overview

In the assignment, you are required to use p5.js and ml5.js to develop an interface for viewing

and interacting with an image. These actions are performed by using face detection and

keyboard operations.

Detailed Requirement

1. Initial Setup

Create a display window.

Load and display an image in the window.

An instant view of the camera should be displayed next to the image and has the same size

as the image.

2. Face detection

A rectangle should be drawn on the camera view to indicate the position and size of the

detected face. When you move your face in front of the camera, the rectangle should keep

following your face. A corresponding position indicator should also be drawn on the image

to follow the movement of your face.

3. Viewing the image

When the ‘v’ key is pressed and released, the interface should enter the view image mode.

In this mode, a plain background with a color of your choice should be displayed. When

your face is moving in the camera view, a rectangular area around the position indicator on

the image should display the corresponding region from the image. When the position

indicator moves away, the background should be restored.

4. Modifying the image

When the ‘m’ key is pressed and released, the interface should enter the modify image

mode. In this mode, the original image should be displayed. When your face is moving in

the camera view, a small circle should be drawn at the position indicator on the image. The

circle should be filled with the pixel color at the location of the position indicator. When the

position indicator moves away, the small circle should be retained. You may use random

values for the diameter of the circle and the degree of opacity of the color in the circle.

5. Finding the faces

When the ‘f’ key is pressed and released, the interface should enter the find faces mode. In

this mode, the original image should be displayed. When your face is moving across the

camera view and the corresponding position indicator is close to a face on the image, the

face on the image should be displayed at a slightly larger size at the same position. When

the position indicator moves away, the original size of the face should be restored.

6. Exiting the view image/modify image/find faces mode

When the ‘e’ key is pressed and released, the interface should exit from the view

image/modify image/find faces mode, and the original image should be re-displayed.

Assignment Submission

? Program (40%)

You should submit your p5.js program and the associated image file.

? Report (60%)

You should summarize your work in the form of a report which should include:

1. A description of the design of the different sections of your program.

2. Screen captures of the output.

3. Limitations and possible improvements of the program.


版权所有:留学生编程辅导网 2020 All Rights Reserved 联系方式:QQ:99515681 电子信箱:99515681@qq.com
免责声明:本站部分内容从网络整理而来,只供参考!如有版权问题可联系本站删除。