Hatch date: May, 2019

       3Way Communication (SQLite) is a web page that mocks a messenger/message board and uses an open source SQLite (provided by glitch.com) as back-end data storage. The inspiration of this project comes from the art exhibition Touching the Prado, which allows visually impaired persons to experience famous art works such as the Mona Lisa through touch, and the Interactive Light Studio project which explores different methods to allow hearing impaired students to experience sound.

      The web page will convert any text input to a sequence of color patterns and separately a sequence of musical tones.

      Each of the letters of the alphabet is randomly mapped to a color and to a tone. The user will not be able to know the message that is left by another user as the message will only be displayed as color patterns and be heard as tones. The intention of this project to create a proof of concept in terms of allowing users to experience the difficultly of communication that hearing and visually impaired people are experiencing.

Hatch date: May, 2018

       SMASH is a simple game that aims for to give the players some fun when they want to take a short break from work. The inspiration of SMASH comes from small games such as Flappy Bird that explored the idea of simple and repetitive user controls.

      The game allows either single player versus computer or two players where they versus each other. The controls to the game is simple, just smash one key as fast as possible.

      At the beginning of the game, the player can choose the playing mode (either PVP or PVC). The player will then enter a username. If the player choose PVP, then both players will take turns entering their names. If the player choose PVC, he will then choose the level of difficulty that he wants to play the game at.

       The levels ranges from 1-100, each level determines the speed at which the player's egg will be attacked. The win condiction is when the opponent's health point (HP) drops to zero before the player's HP. The game will then show the player whether if he had won or lost the game.

Hatch date: February, 2019

      Focus! is a chrome extension that aims to helps the user to stay focus while doing work. The extension will block any website (not including new-tab) with a blue screen and a count down timer. The user has the freedom to choose the block-out time in intervals of minutes at the start of the extension.

      The extension takes input information via prompts.The extension will only start after the user gives permission.

      The user can then set the amount of time that he wants the extesion to work for. The extension sets the timer to 15 minutes by default unless the user asks otherwise. The extension also checks for whether if the value that the user has inputted is valid. For example, if the value that the user has inputted is not a number, then the extension will proceed with the default value of 15.

       The extension then proceeds to count down until the time reaches 0. Then the browser window will return to normal.

       As future work, there are still many details about this projects that can be improved, for example checking against various edge cases that deals with user inputs. Ideally an improved version would also contain more customizable options such as allowing the user to choose the background of the block screen.

Hatch date: February, 2018

     NightMode is a chrome extension that changes the background-color of any website (not including new-tab) to black to reduce the brightness of the display.

     The light bulb buttom works like a switch: it toggles the background color and the text color of the page between black and white. Below are two images that shows the original look of the webpage (top) and the look of the page after NightMode is applied (bottom):

     The approach used is to change the background color of the webpage visted to black and the text color to white. Then toggle the style sheet once the light bulb button is clicked. In the future, I would like to improve the functionality of this small extension by allowing the user to customize the brightness (allow for opacity setting) of the background instead of only allowing one color. I would also like to explore the invert() function, which will invert all the colors on the page including the images.

Hatch date: January, 2019

      The Color Mixer was created to be a part of a bigger project, the Interactive Light Studio. The page aims to give preschool students and the teachers a template of possible mixtures of primary colors. The user of this web page is mainly the preschool teachers, who may not be extremely adequate in navigating through technologies. The web page uses two buttons to control: the "roll" button to shift through different color shapes, and the "move" button to activate the animation that overlaps the two shapes to create the color mixing effect.

Hatch date: May, 2019

      3dEggEarth is a 3D implementation of the 2D game, SMASH. The project explored the tools provided by WebGL (creating 3D objects, viewing through different camera angles, applying lighting and textures) to create a semi-realistic egg-shaped Earth. A small gaming aspect was also implemented in this project. The user simply presses "w" on the keyboard as fast as possible to defeat the enemy.

      The earth model started out as a simple egg shaped solid with a constant light source located on the top right-hand corner. The base material(earth-like) look was achieved by texture mapping. The image that was used for texture is the following:

      Another two layers of textures were applied on top of the base texture to create the cloud and mountainous regions. Lastly, a randomly generated number added to each of the normal vertices of the egg's surface to create the scattered lighting (like fuzzy diamonds) effect on the surface.

      To imitate the rotating motion of the earth, the camera (viewer) was set to revolve around the origin. As a result, the viewer will see changes in the light coming from the source.