HOW TO REMOVE THE SIDEBAR\
This tutorial shows how to remove the sidebar from the game in Sugarcane Format.
2. This is how the style sheet looks using CSS to edit the design in a very simple way. 
3. To remove the side bar, using CSS, use the code
#sidebar{ display: none;
}
4. This is what the game will look like without the sidebar.
https://www.youtube.com/watch?v=xxrrJ9vBhQw
For my final project, I’m using photoshop to remix an image into a different meaning. Since I’m not totally familiar with photoshop, I thought I would do my tutorial on a basic skill that I’ll be using which is cutouts.
Then depending how sharp you want your edges to be, that can be altered as needed!
Here are some examples of HTML codes:
Here is the written code:
<h1>This is a large heading</h1>
<h2>This is a medium heading</h2>
<h3>This is a small heading</h3>
<p>This is a paragraph</p>
<br>(adds a line break)
<img src=”stora.jpg” style=”width:304px;height:228px;”>
<a href=”my.pitt.edu”>Here would be the text you would like the link to display</a>
Here I have displayed the results of that code through twine. These codes are HTML which can be used in different ways. Having defined headings can help with the cohesion of your game.
Here I have displayed how WordPress reads this same html code:
This is a paragraph
(adds a line break)
Here would be the text you would like the link to display
I apologize for the pictures of the bed I am trying to sell, but I have just recently made an advertisement.
When I first launched Twine and started building a story, something that stuck out to me was the tag box on each passage.
In the beginning I just ignored the box since I didn’t know what it was for and didn’t want to screw anything up. But eventually I got too curious and looked it up. It turns out that putting a tag on a passage doesn’t do anything immediately. The biggest use of the tags is for CSS styling.
My plan for my project was to have different background images on each passage based on what was happening in the story and where the player was in the desert. Tags turned out to be a really easy way to do this. When you want some CSS styling to apply only to a certain passage, you pick a tag for it (the only constraints being that it hasn’t been used before and that it’s one word). Then in the CSS you put: body[data-tags~=”TAG”] and then anything you put in that body will only apply to passages you tagged with “TAG”.
The above is a sample from my project. In the code, I made it so that any passage tagged with “highway” would have a certain image as a background and that it would stretch in order to cover the whole page. You can do a lot more with the tag styling such as different fonts/sizes, different link and list styles, etc., but the background image was the only thing I wanted to change from passage to passage.
The only problem with this method of background images is that it takes a very long time for the code to compile and therefore loading times are long. Loading time problems combined with time constraints kept me from individualizing the backgrounds as planned.
Getting music to play in the background of specific pages in a Twine game is relatively simple as long as the music comes from a YouTube video.
Open the YouTube video where the music you want to autoplay is sourced. Under the actual video, second from the left you will see a tab labeled “share”, click it.
After you click on it, the first tab that will appear will be a general share URL. Instead of using that link, click the link next to “share” labeled “embed”.
A new link will appear that’s formatted with html coding. Highlight and copy the embed link.
Open twine and click on the page box where you want the music the play.
Copy and paste the embed link into the dialogue box for the page where you want the music to autoplay.
Within the embed link is the URL for the YouTube video. Locate the URL and at the end, right before the quotation mark. Type in the following: ?autoplay=1
This will cause the video to automatically play.
Locate where it says “width=” and “height=” within the embed link. Change the following number in quotation marks to zero. This will cause the video player to not appear which will make the music seem as if it’s playing in the background.
Close the dialogue box and save your game. The music should now play in the background.
When I code or do anything that requires building, I have to be actively organized. I need a non-dynamic flow for my thoughts and produced work so I can revisit for either review or looking back to regain a thought stream. I noticed many students while making Twines had the passage boxes all over the screen in clusters. If I were someone reviewing the work, this lack of organization would drive me up a wall.
So I’m going to show a simple trick many people didn’t utilize: snapping to grid. It’s super simple and maybe too elementary for a tutorial, but I think for design’s sake it is incredibly important.
If your twine looks a bit like this…
You may need to use snap to grid.
First, go to the view button and click “Snap to Grid”.
Nothing will snap automatically, yet; however, if you try to move something, the box will snap to a grid immediately. You’ll have to do some moving around to get the boxes in the order you’d like. Eventually your setup can look nice an organized like so:
If you want to be able to check if all your links are set easily and see the progression of your twine, I laid my boxes out in a straight line, with the main story line in the middle, with linked photos and off-story choices creating branches or stacking on-top of relevant links.
This way I can see how my story progresses without actually playing it and it makes it easier to check and catch errors you may not find unless you play every single story combination. As your game grows, this becomes more difficult, with each new choice you add comes another factorial of combinations. MATH!
For our group project my group was in charge of gentrification awareness and prevention. To create awareness we decided to make a website to highlight major places in Pittsburgh that have been destroyed and replaced with apartment buildings, malls, stores, etc. The problem with this is they are taking away the history Pittsburgh was built on, the history that adds character to this city. We chose three main places that were gentrified in the last 20 years. The first place was the Homestead Works Steel Mill that they turned into the Waterfront. The next was the Mellon Arena that was turned into a parking lot. The last was the Shenley High school which used to be a beautiful building in Oakland that is now being turned into apartment buildings. The biggest problem I found with this project was choosing which historical places to highlight since there are so many important ones in Pittsburgh including but not limited to The Heinz Ketchup Factory, Kaufmanns, and the Macy’s in downtown Pittsburgh. We chose the three we did because they represented 3 different kinds of gentrification. When we made our decision Siobhan and I had to go to the different locations to take pictures. This was very hard for me because I was on crutches the whole week so I had a hard time getting around to the different places. Besides that we were also supposed to take videos of the land marks we were as and after taking my first video I sent it to Anna. Somehow the video did not send to Anna and it was deleted from my phone. Then we decided it would just be better to take the videos off YouTube because they are more educational. It was extremely helpful to have Anna, a professional, on my team because we were able to do a lot more than others. Our project turned from a project to a reality. I think all and all our project turned out very well and it is something we are very interested in pursuing in the future.
For my final video, I’m going to do a sort of Kanye West tribute video since he’s my favorite artist. I plan on cutting a bunch of clips from YouTube of Kanye West in his music videos, concert performances, television appearances, etc. I would like to put all of these together in Adobe Premiere in a somewhat cohesive manner. Also, I’m going to take the audio from one of his songs and work with it in Audacity as well. In addition to working on one of his songs in Audacity, I was going to record my own voice over the audio on some commentary about Kanye West and who he is as a musician.
I want to keep this at about 2-3 minutes, around the same length as the first Adobe Premiere project. Going along with the first project I’d like to keep clips around 10 seconds, but I may take liberties with the project and make them around 20-30 seconds per clip. In Audacity, I’ll probably just maneuver the volume and work with some of Audacity’s effects to get the sound I think will sound best in the context of the video.