{"id":30,"date":"2023-07-12T13:48:40","date_gmt":"2023-07-12T17:48:40","guid":{"rendered":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/?post_type=chapter&#038;p=30"},"modified":"2023-07-12T13:48:40","modified_gmt":"2023-07-12T17:48:40","slug":"getting-started-with-twine","status":"publish","type":"chapter","link":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/chapter\/getting-started-with-twine\/","title":{"raw":"Getting Started With Twine","rendered":"Getting Started With Twine"},"content":{"raw":"The very first step is to find Twine online! Go to <a href=\"https:\/\/twinery.org\/\">https:\/\/twinery.org\/<\/a> This is where your Twine adventure begins, you have the option to download Twine to your computer but for today we are going to use it online. Once you are at Twinery.org click the blue text \"Use it online\" located in the Post-it note.\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/twine_homepage2.jpg\" alt=\"Twine Home Page\" width=\"75%\" height=\"75%\" \/>\r\n\r\nYou are welcome to skip the tips as we will go through this together!\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/skip2.jpg\" alt=\"Skip Twine tutorial\" width=\"50%\" height=\"50%\" \/>\r\n\r\nTo create a new Story click the green +New button, you will be prompted to give the Story a name.\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/new_story2.jpg\" alt=\"+ New button in the menu on the left\" width=\"75%\" height=\"75%\" \/>\r\n\r\nOnce you have filled in the name field click Create\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/add2.jpg\" alt=\"Fill in the name field and click Create to create a new Twine Story\" width=\"50%\" height=\"50%\" \/>\r\n\r\nTwine games are made up of passages. You will be taken to the map for your new story. If you click on the untitled passage you will have the option to edit it or rename it. Click on the top row menu items to view more options. After you are done exploring click Rename to title the passage, I suggest calling the first passage \"start.\" Click OK.\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/rename_passage.jpg\" alt=\"Rename your passage window\" width=\"50%\" height=\"50%\" \/>\r\n\r\nWhen you click Edit you will see that your page has two main areas, the title and the content area of the passage. You will notice a rename button in the editor so you can rename the passage from this screen as well, remember the title is for you so title your passage something short but meaningful.\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/passage2.jpg\" alt=\"This is the new passage screen\" width=\"75%\" height=\"75%\" \/>\r\n\r\nTo make your game all you need to know is how to make links between the passages. This is pretty easy, while you are editing a passage place double square brakets around text.\r\n\r\n<img class=\"center\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/doors2.jpg\" alt=\"Add double square brackets around text to create a new passage\" \/>\r\n\r\nThe text before the | is what the reader sees and the text after the | is the name of the passage you are linking to! Twine will create links to passages called leftdoor and rightdoor, which are easier to work with than the longer names.\r\n\r\nNow you have a Story map!\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/storymap2.jpg\" alt=\"This story map has three linked passages.\" width=\"50%\" height=\"50%\" \/>\r\n\r\nNow let's add a passage to the leftdoor so we can describe the Left Room. Click on the leftroom and click Edit in the menu or double-click the passage to edit the leftroom passage. To link back to the entry or the rightdoor place double square brackets around text!\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/leftdoor2.jpg\" alt=\"The passage of text in the leftdoor.\" width=\"75%\" height=\"75%\" \/>\r\n\r\nNow your story map looks more connected!\r\n\r\n<img class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/storymap3.jpg\" alt=\"Two connections added to the story map\" width=\"50%\" height=\"50%\" \/>\r\n\r\nAt this point it is important to note that Twine does not automatically hyperlink URLs so you need to use the HTML <code>&lt;a&gt;<\/code> element with the href attribute.\r\n\r\n<code>&lt;a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\"&gt;https:\/\/www.w3schools.com\/html\/html_links.asp&lt;\/a&gt;<\/code>\r\n\r\nThis code will hyperlink a URL\r\n\r\n<a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\">https:\/\/www.w3schools.com\/html\/html_links.asp<\/a>\r\n\r\nYou can also use the HTML `&lt;`a`&gt;` element with the href attribute to hyperlink to text.\r\n\r\n<code>&lt;a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\"&gt;Learn more about HTML links&lt;\/a&gt;<\/code>\r\n\r\nThis code hyperlinks the text Learn more about HTML links\r\n\r\n<a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\">Learn more about HTML links<\/a>\r\n\r\n---\r\n\r\nWhat would you like to do next?","rendered":"<p>The very first step is to find Twine online! Go to <a href=\"https:\/\/twinery.org\/\">https:\/\/twinery.org\/<\/a> This is where your Twine adventure begins, you have the option to download Twine to your computer but for today we are going to use it online. Once you are at Twinery.org click the blue text &#8220;Use it online&#8221; located in the Post-it note.<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/twine_homepage2.jpg\" alt=\"Twine Home Page\" width=\"75%\" height=\"75%\" \/><\/p>\n<p>You are welcome to skip the tips as we will go through this together!<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/skip2.jpg\" alt=\"Skip Twine tutorial\" width=\"50%\" height=\"50%\" \/><\/p>\n<p>To create a new Story click the green +New button, you will be prompted to give the Story a name.<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/new_story2.jpg\" alt=\"+ New button in the menu on the left\" width=\"75%\" height=\"75%\" \/><\/p>\n<p>Once you have filled in the name field click Create<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/add2.jpg\" alt=\"Fill in the name field and click Create to create a new Twine Story\" width=\"50%\" height=\"50%\" \/><\/p>\n<p>Twine games are made up of passages. You will be taken to the map for your new story. If you click on the untitled passage you will have the option to edit it or rename it. Click on the top row menu items to view more options. After you are done exploring click Rename to title the passage, I suggest calling the first passage &#8220;start.&#8221; Click OK.<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/rename_passage.jpg\" alt=\"Rename your passage window\" width=\"50%\" height=\"50%\" \/><\/p>\n<p>When you click Edit you will see that your page has two main areas, the title and the content area of the passage. You will notice a rename button in the editor so you can rename the passage from this screen as well, remember the title is for you so title your passage something short but meaningful.<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/passage2.jpg\" alt=\"This is the new passage screen\" width=\"75%\" height=\"75%\" \/><\/p>\n<p>To make your game all you need to know is how to make links between the passages. This is pretty easy, while you are editing a passage place double square brakets around text.<\/p>\n<p><img decoding=\"async\" class=\"center\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/doors2.jpg\" alt=\"Add double square brackets around text to create a new passage\" \/><\/p>\n<p>The text before the | is what the reader sees and the text after the | is the name of the passage you are linking to! Twine will create links to passages called leftdoor and rightdoor, which are easier to work with than the longer names.<\/p>\n<p>Now you have a Story map!<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/storymap2.jpg\" alt=\"This story map has three linked passages.\" width=\"50%\" height=\"50%\" \/><\/p>\n<p>Now let&#8217;s add a passage to the leftdoor so we can describe the Left Room. Click on the leftroom and click Edit in the menu or double-click the passage to edit the leftroom passage. To link back to the entry or the rightdoor place double square brackets around text!<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/leftdoor2.jpg\" alt=\"The passage of text in the leftdoor.\" width=\"75%\" height=\"75%\" \/><\/p>\n<p>Now your story map looks more connected!<\/p>\n<p><img decoding=\"async\" class=\"center aligncenter\" src=\"http:\/\/syllabus.trubox.ca\/wp-content\/uploads\/sites\/794\/2022\/10\/storymap3.jpg\" alt=\"Two connections added to the story map\" width=\"50%\" height=\"50%\" \/><\/p>\n<p>At this point it is important to note that Twine does not automatically hyperlink URLs so you need to use the HTML <code>&lt;a&gt;<\/code> element with the href attribute.<\/p>\n<p><code>&lt;a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\"&gt;https:\/\/www.w3schools.com\/html\/html_links.asp&lt;\/a&gt;<\/code><\/p>\n<p>This code will hyperlink a URL<\/p>\n<p><a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\">https:\/\/www.w3schools.com\/html\/html_links.asp<\/a><\/p>\n<p>You can also use the HTML `&lt;`a`&gt;` element with the href attribute to hyperlink to text.<\/p>\n<p><code>&lt;a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\"&gt;Learn more about HTML links&lt;\/a&gt;<\/code><\/p>\n<p>This code hyperlinks the text Learn more about HTML links<\/p>\n<p><a href=\"https:\/\/www.w3schools.com\/html\/html_links.asp\">Learn more about HTML links<\/a><\/p>\n<p>&#8212;<\/p>\n<p>What would you like to do next?<\/p>\n","protected":false},"author":724,"menu_order":2,"template":"","meta":{"pb_show_title":"on","pb_short_title":"","pb_subtitle":"","pb_authors":[],"pb_section_license":""},"chapter-type":[],"contributor":[],"license":[],"class_list":["post-30","chapter","type-chapter","status-publish","hentry"],"part":3,"_links":{"self":[{"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/pressbooks\/v2\/chapters\/30","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/pressbooks\/v2\/chapters"}],"about":[{"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/wp\/v2\/types\/chapter"}],"author":[{"embeddable":true,"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/wp\/v2\/users\/724"}],"version-history":[{"count":1,"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/pressbooks\/v2\/chapters\/30\/revisions"}],"predecessor-version":[{"id":31,"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/pressbooks\/v2\/chapters\/30\/revisions\/31"}],"part":[{"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/pressbooks\/v2\/parts\/3"}],"metadata":[{"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/pressbooks\/v2\/chapters\/30\/metadata\/"}],"wp:attachment":[{"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/wp\/v2\/media?parent=30"}],"wp:term":[{"taxonomy":"chapter-type","embeddable":true,"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/pressbooks\/v2\/chapter-type?post=30"},{"taxonomy":"contributor","embeddable":true,"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/wp\/v2\/contributor?post=30"},{"taxonomy":"license","embeddable":true,"href":"https:\/\/pressbooks.bccampus.ca\/letsplaytwinetru\/wp-json\/wp\/v2\/license?post=30"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}