TinPin Studios

The official development blog of TinPin! Follow us for update, Dev SOs, and more. Current project: I'm Too Lazy

[tinpinstudiosblog]

“ACTIV’s House”

Environment and textures update. Many thanks to Sol’s fantastic style.

[tinpinstudiosblog]

Two very different emotions.

[tinpinstudiosblog]

Hello, TinPin Here!

It’s been a while and we’ve been very busy! 

This is a little note to say yes, we are alive and well and yes, the game is still in a refining process but we expect to be done with main tech and art before the end of this month (April). 

Expect more updates as we go through the final stages of putting our first TP project out for the world!

-Papy

P.s. Hope you like the new button and website :}D

[tinpinstudiosblog]

Don’t judge please :( He has feelings too!

[tinpinstudiosblog]

Making of a Trailer: Part 2

Hello there, Natalie here. So, I promised in the last post to talk about working in a video editor and effects software. Then, let’s begin.

Now, disclaimer here, I am not going to claim to be the best video editor out there. I am not even going to claim that my process, tips or tricks are even good advice. This is just how I function in a software that I taught myself how to use.

Stepping into an editing software can be daunting, there is a lot on the screen, and even more you generally do not see(until you click on all the menu buttons and then your head explodes because you are like “what are all these magical tools?!”). Anywho, you move past that and the first thing to do to start working on editing a video would be to import your media files. Do you remember in the last post I talked about how the team would capture footage of the gameplay? In making a game trailer those are the main media files you would be editing, along with some art and sound files. Next, what I like to do is organize these files into folders. In an editing software there is usually a menu where your imported files will be located and in that menu, you can make folders. I generally create an “Art”, “Sound”, and “Raw” folder. An “Art” folder: for any files that are visual but are not in themselves videos, a “Sound” folder: for sound, and finally the “Raw” folder for the raw, uncompressed videos.

Since you have imported your files, now you can start editing! Depending on the software you are using you might have different tools and steps you want to take before getting into editing in the timeline. For instance, in HitFilm there is a tool called the trimmer which allows me to select a sequence of frames in a video asset and then drop that sequence into the timeline.  In essence cutting away any extra frames at the beginning and end of the clip, leaving only the meat of the scene.

Finally we get to the editor where most of the work takes place, the timeline. This is where the art of editing begins. Here you will decide how scenes cut together and flow to create one succinct story. However, first you have to add the clips. I just sort of drop everything into a general order based on the storyboard for the video. Then I dive in head first into the frames and cut and refine as I go until I start to feel the flow of the video. Once I have that then it just takes a little more refining work till I am happy with what I have made. Now there is a fancy technique of converting clips into what is called composite shots so you can add VFX work to the scene, but since, in making this game trailer, I never touched on that I won’t discuss it here.

For me, the hardest part of editing is the audio work. I find it difficult because at least for the I’m Too Lazy trailer, when the gameplay was recorded the recording did not capture the sound properly. So, when the raw videos were played the sound associated with them was like grinding metal, nails on a chalkboard, or whatever worst sound you can imagine. This caused me quite a problem cause now to make the video believable I had to add and then balance game sound clips with the trailer music. As you might, imagine it was a headache. Generally, in editing, you do not have to do that much work for audio. More often than not when making a final version of a video you will be adding in pre-made and refined sound clips that you just have to trim, place properly, and adjust the audio levels. Even better, you just might have to adjust the levels of the audio that comes with your clips.

After all that is done, the final stretch of editing involves tightening up those transitions and effects you might have. Refining is the most important step, and spending most of your time polishing your work will show much more than restarting your work over and over again. Lastly after everything is done and polished you export the videos in whatever format suits you and you are done.

I hope some of you have found this insightful and that I  have not misled any of you with my own personal take on editing. Keep checking back at this site for more posts in the future!

~Natalie exits stage left.

[tinpinstudiosblog]

New Followers :)

Papy Here!

I just want to take the time, on behalf of all of us at TinPin, to thank all of our newest followers! Guys, it means so much to us and we just want to thank those of you who are taking the time to heart and reblog our content! Thank you for the support!

You guys rock,

Papy <3

[tinpinstudiosblog]

Making of a Trailer: Part 1

Hiya there! Natalie here; Cinematic Designer for TinPin Studios, in case you had forgotten. So today we are going to talk about one of my favorite things, screen design and video editing!

To start off I would suggest everyone take a look at the trailer for this game:

Now to begin, we must start at the beginning, which is not even talking about getting the footage. No, to start working on a video the first thing to do is to storyboard it. To start storyboarding, or in fact anything, it is important to understand what you are trying to convey to the audience and, generally as a storyboarder, it is also important to be aware that you are not the creative director. You as the storyboarder, the video editor, etc. are the middleman. A person whose sole purpose is to transfer in the most comprehensive, compelling, and simple of fashions the director’s vision. In the case of the trailer above, TinPin Studios’ vision was to introduce the player’s only companion, ACTIV as if he was being advertised like a product but, also plant a seed of uncertainty and mystery in the potential players’ minds.

Here and now you all might be wondering, what does storyboarding look like? Well it does vary depending on the media being presented, e.g., an animated feature’s storyboard will look very different to a commercial storyboard. Some eagle-eyed followers of this blog might have noticed a storyboard I put in a previous post but, here is another example just in case:

So then you know what a storyboard looks like, what comes next when you have finished it? Next would come the humdrum of getting it approved, revising if not approved, and such. But let’s skip to the fun part, getting footage!

Gathering footage may well seem very simple and straightforward but you would be surprised. Many times in game trailers the scenes shown are rigged. Heck, sometimes the build used to take the footage is not even something that will be in the final game. Sorry to shatter any delusions, but as any scrooge might guess it is all smoke and mirrors. As it would be then, it takes a lot of effort from the team to play whatever build they have available, set up the specific scenes they want, and then capture the footage. Once that is all done the footage then would be passed down through the metaphorical production tube to the video editor.

Haha, I wish. Seriously though, originally I edited the trailer in Adobe After Effects CC. It is probably one of my favorite software of all time. Sadly, good things don’t always last and, as far as TinPin Studios goes we must use cheaper alternatives. On that note a lovely software called HitFilm has appeared and it’s super effective.

Sorry for all the multi-part posts, I really wanted to sum up everything this time in one post with a nice big bow at the end. However, I find there is so much I would like to say and rather than bog you guys down, bite-size portions seem preferable. So, keep your eyes on this blog for the second part of Making of a Trailer, where I will discuss what goes into working in a video editor and effects software!

~Natalie exits stage left.

[tinpinstudiosblog]

Creating a Boss Battle: Part 2

Hello folks! Natalie here.

So, last time we went over my thought process through creating the physical stage of the boss fight. This time we are going to talk about the emotional build-up of the fight during the mental stage. It is important to note I will be discussing the idea of the interest curve for this aspect of the level.

You can think of an interest curve like a graph describing the plot of something; there’s your initial hook, a period of rising tension, the big climax, and finally the end. In a boss battle this is relevant too. For example let’s take a classic Zelda boss fight, Gohma from Wind Waker.

First we start at point A, when you see the dragon tail hanging from the ceiling. Then we are at B as Gohma rears up out of the lava. Points C, D, E, and F are the player figuring out the contraption to weaken the boss and the first couple of strikes. The last cycle of steps and the final blow on Gohma’s eye make up point G. H would be the cutscene that plays after you beat the boss.

Back to talking about our game though, we already had one interest curve complete at the end of the first part, and now we are immediately barreling into another. The transition from the physical stage to the mental is our hook. The player has already beaten ACTIV to the ground, so ACTIV is hurt but still determined and angry.

For the mental stage it was important that this confrontation be more of a back and forth between ACTIV and the player. This is their final moments. The player could finally rest control from ACTIV or ACTIV could come to terms with everything. So, even though it is a boss battle it is more like a conversation. We are also delving into the deepest consciousness of ACTIV, here all his flaws and good points are pushed to their extreme.

But that’s all for now folks! Hope you enjoyed this little discussion. Keep on the lookout for more posts in the future!

~Natalie exits stage left.

[tinpinstudiosblog]

Creating a Boss Battle: Part 1

Hello once again! Natalie here!

So big disclaimer here: SPOILERS AHEAD!!!!

Now that, that is out of the way on to the final level! To put it bluntly the final level isn’t so much a level but a multi-part boss battle. The way I plotted out the concepts in my head was that the player character would take on active in two main parts: a physical stage and a mental stage.

The largest challenge when planning how to handle a boss battle was how to introduce it to the player without it coming out of left field. So, I started with the physical stage and ACTIV instigating the fight by throwing “something” at the player that they would dodge in a cutscene. (Like say a couch?) The player then being introduced to a new mechanic, dodging, could move on to the first part of the battle.

Still, it got more complicated from here. I originally envisioned the physical space warping around the player and ACTIV, but that wouldn’t work under our technical limitations. So, instead ACTIV retreats to his “private” section of the house and the player follows. Once the player enters this new space the boss battle would truly begin.

I must say that when envisioning this battle for the first time I had been watching a Dark Souls Let’s Play in the background and was heavily influenced by the visual design of the Gwyndolin boss fight. So the player steps into a long corridor lined with columns when entering ACTIV’s “private” space. Here the player must dodge ACTIV’s projectiles while making progress towards where ACTIV is.

Once again, initially I was just going to have the player whaling on ACTIV in melee combat. However, due to ACTIV being little more than a flat sprite, the design needed to be changed. (In my opinion for the better.) So the idea of a Zelda inspired boss battle came up during a brainstorm session with the team. That meaning that there would be three stages to the encounter. I still wanted it to be a physical fight though, with the player hurting ACTIV in some way. Then after that, we’d finally come to the end of the physical stage of the fight and we transition into the mental.

But that my friends is a tale for another day! Keep checking back for the second installment of “Creating a Boss Battle”!

~Natalie exits stage left.

[tinpinstudiosblog]

We’re Back Baby!

Hello there, Natalie here again.

Surprise, surprise we’re back! Sorry we have been away so long! We have been in our secret, emergency bunker; theorizing, speculating about how we can make our game better!  However we have now reemerged, like the butterfly, better than before.

Currently, our team is diligently finalizing the level design and concepts for the concluding level of the game (no spoilers). But, if you are the spoiler sort there will be a long post tomorrow, made by your’s truly, describing the basic concept and ideas that have come to this new level.

So, keep your eyes peeled on this page as more updates come out!

[tinpinstudiosblog]

I’m Too Lazy: Art Style

Sol here! I’m one of the texture artist for ImTooLazy and I wanted to give a quick run down on our style.

Most of the object within our game are composed of realistic textures that have been blurred down, so that its not too real looking. Slight adjustments to the original color have been changed by using a multiply layer in Photoshop with an opacity usually around 50%.

Another easy way for us to get rid of real looking textures is by using the CutOut option in Filter Gallery which gives the textures a more painted look like on this door. Be careful when using it for consisting texture like marble, because the pattern can cut itself off giving a seem for your texture. An easy way to fix this problem is to either get rid of any pattern cut at the edge or offset the pattern.

Last but not least is the line art. Most the texture seen in this game have black lines going through them. We wanted to go for a lazy style that would be able to fit the feel of the overall game, so that's what we did...lazy. The design was made to look like someone scribbled here and there for a quick job, truly giving off that lazy feel.

-Sol signing off

[tinpinstudiosblog]

Player Hoodies!

Rufioh again!

Today I want to talk about the Fashion in our game! and what Choices I made to the designs of the hoodies for our Player Character! This is the First one and default hoodie for the player, Its themed after ACTIV’S color palette. I wanted the feeling that when you start the game you belong to ACTIV, he owns you and the world you inhabit

This one is designed after the god tiers of  Homestuck, a popular Webcomic that spanned over 7 years. This webcomic was a big part of my later childhood and meant a lot to me. This hood exists as a tribute to that comic.

This hoodie is a direct reference to a game that was produced in our graduating class, The game, headed by Will Preston is called Iris Burning and you can check out their game HERE. This Hoodie is simply the logo for their game and colored mainly by the color of Iridium, a primary resource in their game.

This hoodie is a direct Inspiration from a guild from wayyyy back in my childhood, back from when I was playing DOFUS. The symbol in the middle was our clan symbol and for a long time me and 3 other members managed the guild together. This experience profoundly affected me and is the base for how i view games at their great form of interactions. Our Guild name was Walk The Dinosaurs or WTD for short.

This Hoodie is a big inside joke for me, another game we proposed before we graduated was a game called Rift Walkers, and a game i still want to personally make one day... This hoodie was inspired by one of the main characters, Tony. Tony always had a big hoodie on and later dons this specific one.

Thats all I wanted to share today, and give some insight to why I made these specific designs...

-Rufioh AWAYYYYYYYYYYYYYYYYYYYYYYYYYY

[tinpinstudiosblog]

Photos of ACTIV and PLAYER

Rufioh Here!

Today I want to talk about some photos I made of ACTIV and the Player Character. Much has changed in development and we began to explore a small story of a player and his place in ACTIV’s world.

To display the relationship I have displayed it through a series of 4 photos, these are meant to be viewed as prequel to the events of the game, hinting at the game gamely nature of our project.

The Story itself is rather sad, As we see ACTIV try and try and try to control the player... only to have it blow up on him.

It was important to keep the humor of the game through the photographs and keep the comedy rolling!

-Rufioh out!

[tinpinstudiosblog]

Creating a disorganized enviornment

Author: Rufioh

Hey guys Rufioh here and today were going to be talking about how to create an unorganized environment. Now before we begin creating an Intentionally disorganized environment takes careful design and planning. If done haphazardly you will only frustrate your player rather than engage them. 

With this in mind when we created the final level of our game we wanted the feeling that things have gone very wrong. The player is now somewhere the laws of the game world have begun to break down, The sky is now a space sphere and things have begun to float around. This now adds a new dynamic of how the player can interact with the environment. initial presentation can greatly effect how the player feels and approach where they are. Keep these ideas in mind when you are creating an environment

We also used repetitions as a theme in the final level to sell the chaos, with ACTIV’s face  all over the environment it further sells the chaos

-Rufioh

[tinpinstudiosblog]

Creating Pixel Art

Hi guys Rufioh Here and I’m going to talk about my process in creating some pixel art for our game. We use a lot of pixel art in our game, ACTIV runs almost entirely on pixel art, but we use for items the player can interact with as well. For those not familiar with pixel art you may be wondering how pixel art gets animated. That’s the goal of this post, shedding some light on basic pixel art techniques. 

Here is a sprite sheet i made for one of our interaction items, as you can see its a sheet with what looks like an animation. When animating with pixels you make what is called a sprite sheet. Sprite sheets work like film stills, you make an animation frame by frame and put it all on one sheet, and that is step one.

Now begins step 2 setting up in engine a way to “play” the sprite sheet

This is a still of the pixel art in unreal, here we use the flipbook node. Much like a flipbook in real life, it will read the sprite sheet after we tell it how many rows and columns are in the sheet then play them in a sequential order. This animates our sheet and brings it to life!

I hope this helps all you beginners out there!

-Rufioh

[tinpinstudiosblog]

A lot of tech got done this weekend.

Here is a run down of all of it.

Author: Isadora Salvetti

This weekends objectives:

Fully implement the mechanics our team members have been working on and make them work with each other.

Polish what was already implemented.

Script the first few events on the flowchart.

Polishing the dialogue system

As mentioned, all dialogue is being handled by a macro. Some changes have been made to said macro.

It is considerably messier, but now the delay problem has been fixed - delay will start running after the end of each string, not the beginning, preventing the text to overlap.

However, overlapping dialogue is still a problem if it comes from different calls. Make sure no dialogue is being fired while another is being displayed.

New Game Instance: Global Variables

The variables that are used to track the player’s progress are stored in the GameInstance_GlobalVars. Their numbers roughly represent the order in witch they are used. KEEP IT ORGANIZED.

Using the dialogue system:

All dialogue is stored in the dlg_interface blueprint - the red sphere in the middle of the house

Each time you want to use it, you will have to create a custom event inside it, and cast to it. Create a public actor variable to use as target

This is what the custom event will look like.

All of the variables involved are organized in groups, KEEP IT THAT WAY OR ELSE.

Inside of this actor, there is a tick node to trigger dialogue that depends on checking/ updating variables stored in GlobalVars.

Add more pins to the sequence and use the casting to get/ set more variables as needed.

Doors

Doors have been modified to be opened by the AI, not the player. Cast to TheDoor actor, pick the one you want to affect and trigger the custom event OpenDoor or CloseDoor. They start closed by default, what can be changed by checking the StartsOpen? box. 

Note: This is valid for all of the interior doors. Since the outside door opens differently, those still need to be created.

Teleporting

This is an example of what teleporting looks like - it is inside of the dlg_interface. It only requires a marker to be placed in the spot where you want to teleport to.

Sitting

In the folder for the kitchen new mechanics there is already a few sitting blueprints. This is what they look like:

Each object triggers two dialogue lines, one for as the player sits and one right before the object is deleted. Using this as base, making new places to sit with individual dialogue should be quick.

Note: right now each object needs their own set of custom events in the dlg_interface. It may be a good idea to make only one set for all of them and have the necessary variables be changed inside of the objects blueprint instead.

Overhaul notes:

NO MORE moving blueprint components from the world map. Move them inside of the blueprint itself.

NO DELETING ANYTHING without triple-checking it’s function. Castings will break. And you will be the one to go back and fix them.

There. I’m done bossing you around. Go back to work :)

[tinpinstudiosblog]

ACTIV: From Concept to Game

Rufioh Here!

Today I wanted to Share the Process of Creating one of the characters for our game. ACTIV is his name and he is the character the Player interacts with the most. I wont spoil his role in the game, but think of him as your constant companion.

Concept Phase: 

When We began Phase II Development for Im Too Lazy we decided we needed a shift in theme, or narrative to support our core gameplay. The solution was a  companion that would be in constant contact with the player

The Solution was ACTIV, an AI that could be on the players phone, and I began creating some concept art.

My core of Inspiration came from the idea of a cute antagonist, but since he was also an AI I looked into rouge AI characters as well. The First pass of design looked like this. This wasn't my only idea but it was the primary and ultimately the final design to be carried over to the game. My other Page of Concept Art Showcased how he might speak to the player, wither he got his way or didn't.

As you can see there were a few ideas that were tossed around before a final look was chosen (even one where he was a garbage can!) From this stage we picked the final design and handed it off to our pixel artist, who created the design at the top of the post. This art is his official representation in the game. However, without spoiling too much, he often represents himself in other ways. We will reveal more about ACTIV as we move through the process.

- Rufioh