Roll20 uses cookies to improve your experience on our site. Cookies enable you to enjoy certain features, social sharing functionality, and tailor message and display ads to your interests on our site and others. They also help us understand how our site is being used. By continuing to use our site, you consent to our use of cookies. Update your cookie preferences .
×
Create a free account

[BitD] Blades in the Dark Character Sheet

I am working on a BITD sheet and would love some feedback. Here is my current version. I am new to making sheets so I am currently trying to learn how to make tabs but would really appreciate any other feedback you all have.&nbsp; <a href="https://github.com/YaterODST/Blades-in-the-Dark-Character-Sheet1" rel="nofollow">https://github.com/YaterODST/Blades-in-the-Dark-Character-Sheet1</a>
1458601281
Finderski
Plus
Sheet Author
Compendium Curator
So far, things are looking pretty good. &nbsp;I don't know the game, so take whatever I say with a grain of salt... Generally speaking, for this to work with Roll20, you'll need to preface the name of each form element with "attr_" otherwise data won't save. &nbsp;As an example, under character, your Name field should look something like: &lt;input type="text" name="attr_Name" placeholder="Name"&gt; However, I would personally recommend the name be "attr_character_name", because then it will auto populate with the name of the character sheet journal, and the name will only need to be entered once. But that's a personal preference.&nbsp; Character Sheet Tab: Harm, Coin and Stash seem to be off balance. Meaning, there's a lot of white space weighted heavily on the right side of the sheet. Playbook Tab: Seems like the Special Abilities would be better suited as a repeating section rather than a static number of fields. With a repeating section, you create one set of fields and people can add however many of that "data set" they want. &nbsp;So, for your sheet, in practice you could do something like: &lt;fieldset class="repeating_specialabilities"&gt; &lt;div class='sheet-2colrow' style='width:50%;'&gt; &lt;div class='sheet-col'&gt; &lt;input type="checkbox" name="attr_trained"&gt; &lt;input type="text" name="attr_specAbilityName" placeholder="Ability Name"&gt; &lt;/div&gt; &lt;div class='sheet-col'&gt; &lt;input type="text" name="attr_specAbilityDesc" placeholder="Ability Description"&gt; &lt;/div&gt; &lt;/div&gt; &lt;/fieldset&gt; Then, an +Add button would appear on the character sheet and every time someone pressed that button, a new row would appear with those three fields (a checkbox and two text boxes). Dangerous Friends and Special Items would also benefit from being a Repeating Section, too. Understandard Items, you have three radio buttons, and currently all three of them can be selected. If only one of them should be selected at a time, then you will need to make them all the same name with different values. &nbsp;Something like: &lt;input type="radio" name="attr_load" value="3"&gt;3 light &lt;input type="radio" name="attr_load" value="5"&gt;5 normal &lt;input type="radio" name="attr_load" value="6"&gt;6 heavy If all of them can be selected at the same time, then you would want to use checkboxes, because once you select a radio button set up the way they are currently, you can't unselect one. &nbsp;Which I suppose would also mean, if there is a non-encumbered value (less than 3), then you would want an option for that as well, otherwise, once the character is encumbered, the character would ALWAYS be encumbered. The last thing of note, the code seems to be backward to my mind. &nbsp;When I read code and try to match it with the design, I read top to bottom, and right to left. Meaning, I expect the elements at the top of the sheet to be near the top of the code, and for the tabs to be similar. &nbsp;So, I would expect the Character sheet Tab to be above the code for the Playbook tab, and the code for the Playbook tab to be above the code for the Crew tab. &nbsp;I had to do a control+F to find your code for the character name field, because it was nowhere near the top and scrolling through it I couldn't find it because all the Special Abilities were above it, etc. &nbsp;Not saying you have to conform to this methodology, but it seems to be what most sheet authors follow. I would also recommend reading over the&nbsp; Character Sheets Wiki Page , and especially the&nbsp; Building&nbsp;Character Sheets page . &nbsp;It has a lot of useful information. I hope this helps, and you've done a great job so far. Keep up the work and congrats on becoming a sheet author. It can get kind of addictive (just ask Coal Powered Puppet—we may need to have an intervention for him soon). :) Oh, and never hesitate to ask question in this forum—some of the most helpful people around frequent this forum and they are always happy to answer questions.
Thanks a ton for your feedback. It certainly will help a lot. Currently I am attempting to set up something where i can have checkboxes appear over an image for the crew section of the sheet. I can get it to work just fine in a web browser, but roll20 just displays the image with the check boxes below. Here is my html for what I am trying to accomplish.&nbsp; &nbsp;&lt;div class="container"&gt; &nbsp; &nbsp; &lt;img src="<a href="http://i65.tinypic.com/2mmajp5.png" rel="nofollow">http://i65.tinypic.com/2mmajp5.png</a>"&gt; &nbsp; &nbsp; &lt;div class="tag"&gt; &nbsp; &nbsp; &nbsp; &nbsp; &lt;input type="checkbox" name="crew-checkbox"&gt; &nbsp; &nbsp; &lt;/div&gt; &nbsp; &nbsp; &lt;div class="tag2"&gt; &nbsp; &nbsp; &nbsp; &nbsp; &lt;input type="checkbox" name="crew-checkbox2"&gt; &nbsp; &nbsp; &lt;/div&gt; &nbsp; &nbsp; And the accompanying CSS. .container { &nbsp; &nbsp;width: 535px; &nbsp; &nbsp;height: 243px; &nbsp; &nbsp;position: relative; } .tag { &nbsp; &nbsp;float: left; &nbsp; &nbsp;position: absolute; &nbsp; &nbsp;left: -6px; &nbsp; &nbsp;top: 53px; &nbsp; &nbsp;z-index: 1000; &nbsp; &nbsp;padding: 5px; &nbsp; &nbsp;color: #FFFFFF; &nbsp; &nbsp;font-weight: bold; }
1458616715
Finderski
Plus
Sheet Author
Compendium Curator
That's where coding a sheet for Roll20 is different from normal web programming...it's all contained in another page already. &nbsp;So, as such, you don't need to declare a link to your CSS file, because it happens automatically when you set up the custom sheet (or when you put it up on Github for everyone to use). I don't know if this is the problem or not, but try putting "sheet-" in front of all your class names. &nbsp;For example: sheet-container and sheet-tag. &nbsp;Do that in both your css and your html. The "sheet-" is needed for Roll20 to know it's a character sheet class, and it also prevents you from creating a class that can override roll20 core classes that would screw up the game. There are other quirks to coding for roll20 character sheets that can be leveraged in neat ways (for example declaring multiple input fields with the same name allows you to have that value in multiple places on the sheet while only modifying one of the fields). &nbsp;Like I said, I'd recommend reading the wiki a bit, and also looking at the code for some of the existing character sheets to see what they are doing and how they are accomplishing it. It helps a lot to see how other sheets are working, because it can give you an idea of how to do what you want. &nbsp;For example, what you're trying to accomplish above sounds similar to something CPP did in the Iron Kingdoms sheet, so that may be a good place to look. &nbsp;I recommend creating a sandbox campaign where you can mess around with your custom sheet, but also load in existing sheets to see what they do, and then you can get the code from github to see how they did it.
Thanks GV. I appreciate the advice and assistance. I will be continuing to update the Github file for this sheet as I go so lets see how this turns out. :) And you are right about this being addicting. lol. &nbsp;
I have recently updated the sheet with some improvements of layout, and some general code cleanup. Still a work in progress, but check out the new version.&nbsp; <a href="https://github.com/YaterODST/Blades-in-the-Dark-Character-Sheet1.git" rel="nofollow">https://github.com/YaterODST/Blades-in-the-Dark-Character-Sheet1.git</a>
I am aware of the issue with things not saving correctly. I am working on resolving the issue and will update when it is fixed. I forgot to add the attr_ prefix to my input fields so nothing saves.
<a href="https://github.com/YaterODST/Blades-in-the-Dark-Ch" rel="nofollow">https://github.com/YaterODST/Blades-in-the-Dark-Ch</a>... Issues should be resolved.