el knickyknick

My name is knickolas santiago. this blog holds and archives a bunch of my work as a game and Web designer and developer. I've been learning a lot of new technologies lately and hope you enjoy my work.

[elknickyknick-blog]

Lately I’ve been working on designs for a business card using my handle - elknickyknick. After looking through some Google fonts, I settled with one called Fjalla One. I’ve been working with different dimensions of the letters and actually making the letter “k” out of the letter “h”. The bottom gray box is what I imagine it would look like. the rest is just illustrator work.

And for those wondering why I stylize my name as “Knickolas”, my father originally wanted to name me after his favorite basketball team at the time (the New York Knicks). Ever since, I’ve always stylized my name like that when signing my work. 

[elknickyknick-blog]

Here are some finished shots of the Inspire project I was part of a couple months ago. In this project, two users choose from a given list of musical artists and then generates a similar artists based on genre, common artists, and influential artists. Two projectors project images of the artists on the flat surfaces of the “spire.” Music from the generated artist is played while all the images slide and transition in. The project uses APIs to gather information on the artists.

My main contribution to the Inspire was programming the transitions using OpenFrameWorks. I handled this by having the image holder elements grow into the flat surfaces without affecting thee dimensions of the actual image. Having such a large scaled project that people seemed to enjoy was a great feeling.

Timer and Transition Code

Full Project Code

[elknickyknick-blog]

Another web app I’ve been working on using the canvas tag utilizes the user’s webcam. The user can add text (using some fancy web fonts) and some stickers to the page. It works a lot in the same way that the painting app does. It uses multiple canvases to allow the user to put images over the video tag that holds the webcam video. The code, however, is in a class structure. 

The buttons allow the user to clear the stickers. The capture option doesn’t work to well yet so that’s definitely something I plan on fixing soon. I’m also looking to combine the two canvas apps I have. Since a lot of the functionality is similar, I think it would be pretty easy to add.

Code

[elknickyknick-blog]

I started some work on a paint web app using the canvas tag. The interface is pretty bland right now. I haven’t really decided how I wanted to look quite yet. The user has a couple options on what tools or colors to use, but I’m working on opening up those options. One neat thing is the export button.

Languages: HTML, CSS, JavaScript 

Code

[elknickyknick-blog]

[elknickyknick-blog]

My good friend Kiara just turned 22 late last month, and I thought it would be really cool to make a Snapchat filter for her birthday. I had never made a custom filter, but someone in my group for my Inspire project had made one so I thought I’d give it a shot.

Setting it up was definitely a lot of fun. I took inspiration for the filter from Taylor Swift’s song “22″ and it was featured around McFadden’s Irish Pub (42nd Street between 2nd and 1st Ave).

One thing I didn’t anticipate was the pink parts being opaque once the filter went live. I originally wanted it to mostly transparent like in the first image. There were some yellow dots to give it a “glittery” feel but it got lost in the live version. Still a great learning experience and hope to do it again. 

[elknickyknick-blog]

And let’s start rolling out the finals.

So for Physical Computing and Alternative Interfaces, I made a controller with the Arduino and joystick I got with it. I also had a button on there. Planned on having more, but the end projectvreally didn’t need it.

Through serial comminication, I connected Arduino and Processing. The Arduino printed out a specific character if it picked up a specific value from the joystick or input from the button. Processing picked up the inputs and moved the player on the window while pressing the button shot a bullet.

I started off deffinately overthinking how Processing picked up serial input. Once I picked it up, Processing was still really slow. I wanted to make a drawing up, but connecting the lines looked weird and half weren’t picked up. I’m hoping the speed is something I can work out because I’m really interested in how much range the joystick can pick up. I’ve always preffered console gamong over PC because of the feel of a on controller so learning how to actually lrogram one was ablot of fun.

[elknickyknick-blog]

This past semester I visited the Construct here at RIT. It's nice that it's accessible to us especially becuase it's such a booming industry - I have a friend who works with 3D printing and did a job out in Israel, I saw some girls at Imagine RIT with a Gameboy case for an Ardiuno made at the Construct. It's also just so soothing them to watch them in action.

They have all this cool stuff people made there. Obviously Yoda has to be there, haha

[elknickyknick-blog]

This is so cool! I was recently in a production of Shakespeare’s A Midsummer Night’s Dream as part of RIT’s COLA’s 400th anniversary of Shakespeare. It’s been a great couple shows so far with so few hiccups. This is RIT’s first outdoor production and we didn’t even have a stage crew so most of the setup and striking was done by us the actors. 

Here are some interviews between a couple of the actors and RIT's own University News discussing why theater and diversity are so important to us. We have more footage and interviews here with Channel 13.

[teamprojectgroup7]

Building and testing the Spire! Definitely going to be awesome.

We used foam core to make all of the boxes and using 2 different projectors we create projections onto them. It’s going to be awesome when we test it on the full spire but we won’t post them until after ImagineRIT. Don’t want to ruin the surprise!

[elknickyknick-blog]

I recently had the pleasure of working on a mixed team of designers and developers this past semester on an installation for the Rock and Roll Hall of Fame.

Our project was called Inspire, a music discovery installation. Our goal was to create an interactive experience that would bridge connections between artists and genres specifically across generations. In the end, we provided a touch table with a list of artists that two users could pick from. Once the selection was complete, media of the two artists would be projected onto the spire (the mountain of white boxes above) along with their influence at the top. We showed our users that any musical artists two users liked somehow had a common influence that connected them.

There are more picture to come as we sort through them all and I'm very excited to share those. It was an absolute blast to work with the team and on this project.

[elknickyknick-blog]

A really good shot of my pitch-matching game

[elknickyknick-blog]

The Challenge: Our goal was to make an interactive experience using the Arduino and a microphone and a speaker.

My Approach: I decided to make a small game ou of the assignment. The program takes a short melody with the following note order: C G G A G (rest) B C. The notes are given a random pitch that the user must match. To do so, the user has four switches and four buttons for each note type: the A note, the B note, the C note, and the G note. 

When the button for each respective note changes the player’s notes pitches by one octave. The switch for each note has two settings: HIGH and LOW. When a note’s switch is on HIGH, the octaves go up, and when the switch is on LOW, the octaves go down. A button (on the far-left in the video) replays the player’s melody. 

The mic is used to “ask” the Arduino for the game’s own melody. When it picks up a certain amount of sound, or if it’s blown on, it will replay the game’s melody. 

[elknickyknick-blog]

Well, here’s my first project from using an Arduino Nano - pretty proud of it. The project features a heat sensor, two light sensors (light-sensor-A is smaller than light-sensor-B), a switch, and 3 LED lights (one red and two green ones).

Now, on the switch’s first setting (LOW), the green light closest to the Arduino chip (green-light-1) is set to be on; whenever the heat sensor detects a lot of heat, however, the red light goes on.

When the switch is on its second setting (HIGH), the green light further from the chip (green-light-2) goes on. The Arduino then utilizes the two light sensors. If the light sensors collectively detect a small amount of light, or no light at all, then the red light goes on. If light-sensor-B receives little to no light, or if the sensors collectively receive a small amount of light too big to trigger the red light, then green-light-1 will turn on instead of green-light 2. Covering light-sensor-A will have no affect on the lights.

It was cool to work with the Arduino. I’m definitely looking forward to doing more with it.