Recent Updates Page 5 Toggle Comment Threads | Keyboard Shortcuts

  • Belen 9:40 am on September 20, 2021 Permalink  

    Feature update – Locally scoped data for components and program templates 

    Here’s what’s new:

    Locally scoped data for *components


    This new functionality allows you to create similar buttons with different click handlers on the same page. Let’s demonstrate how it works by looking at an example!

    Suppose you have a collections of associations, each association contains the name and age of all your friends: 
    >> people = [{"name" -> "Peter", "age" -> 24}, {"name" -> "Josh", "age" -> 37}]
    The size of this collection can change, as you have a module in your program to add or remove friends.

    You can dynamically generate the components using the following code: 
    *for: person in people
	*component
		*header: {person["name"]}
    On each iteration of the *for loop, we retrieve an element from the list of friends (the association of data about a person), save it into the variable person and generate a component that displays the value of the key “name” for that association.

    Now let’s make these components clickable! Since the code under *click gets executed only when the user of your program clicks on a component in particular, we use the following syntax to be able to retrieve each person’s data: 
    *label: people
*for: person in people
	*component
		*header: {person["name"]}
		*with: person
		*click
			Name: {it["name"]}
			Age: {it["age"]}
			*button: Back
			*goto: people
    We use the keyword *with to tell GuidedTrack what variable it needs to store for when the user clicks on the component being generated. We can use any type of variable: in this case, person is an association. Afterward we access that data in the code indented under *click by invoking it, as shown on the example. 

    Note that you cannot access the name of the person whose component you have clicked using Name: {person["name"]} because, as mentioned before, the code under *click gets executed when the user clicks on the component. This can only happen after all the components have been rendered, so person by then will contain the data of the last person in the collection of friends (since that is what person ends being assigned to in the last iteration of the loop).
     

    Use a template to create a program


    You may have already noticed that, when creating a new program, you are given the option to start from scratch or use a template:


    If you choose a template, the program you create is preloaded with a fully functional program. You can run/preview it as soon as it is created to evaluate what changes you need to make to the template to meet your needs. You will also notice that the code of the template has a lot of comment lines which should make it easy for you to adapt the template.
     
     

  • Belen 2:38 pm on September 15, 2021 Permalink  

    Case study: Emailing a follow-up program to the participants of your questionnaire 

    One common use for GuidedTrack is to deliver a questionnaire and then give the participant some feedback based on their answers. Here are some examples that may have that structure:

    • A survey or study where you evaluate the participant’s responses and tell them how they compare to others who previously answered the same survey.
    • An assessment tool where, based on the answers of the participant, you suggest different exercises for them to do.
    • An educational tool where you identify the user’s prior knowledge on the subject and you deliver educational modules tailored for them.

    You may want to email this feedback to the users of your program so that they can save it and access it at a later time.

    On this step-by-step case study we guide you through the process of generating a report program for a survey and generating a URL that you can share with the users of the questionnaire via email.

    Start by creating two programs, one will be your survey and the second one your report. Let’s look at the code inside each of them!

    In your survey program you will create your questionnaire, saving the answers that you will use in the report as variables. In the survey of this case study there are two questions:

    *question: How many hours do you sleep on average every night?
	*type: number
	*save: hoursOfSleep

*question: How rested do you usually feel after a typical night of sleep?
	I’m always tired
		>>wellRested=0
	It takes me a while to be fully awake, but then I’m fine
		>>wellRested=1
	I am ready to go as soon as I’m awake
		>>wellRested=2

    Afterward, you ask the participants of the survey for their email to send them their link to the report:

    *question: Please, enter your email if you would like to receive the results to this survey via email:
	*tip: You can leave this blank if you don't want your results via email.
	*save: email
	*blank

    Then you generate the link to the report program, passing the value of their answers as URL parameters, and save it to a variable. In this case, we have called that variable reportLink:

    >>reportLink = "https://www.guidedtrack.com/programs/e4q95ez/run?hoursOfSleep={hoursOfSleep}&wellRested={wellRested}"

    This is how you build the report link:

    1. Create a new program for your report. Go to Publish and click on the Copy button under Send the program link directly

    In this case, the run link of the program is https://www.guidedtrack.com/programs/e4q95ez/run

    1. Then, add their answers as URL parameters. You use the symbol ? to indicate that you are appending parameters to the URL, with the format ?parameter1=value1&parameter2=value2&parameter3=value3 … (for each additional parameter, you will use the & symbol followed by the name of the parameter, the = sign and the value of the parameter). 

    As you can see, in our program we have added two parameters: hoursOfSleep and wellRested. The name of the parameters in this case is the same as the name of the variables in the program, but you can choose whatever names you prefer, just avoid spaces and special characters! In order to set the value of each parameter to whatever is stored in your variables, you surround their names with {brackets}: hoursOfSleep={hoursOfSleep}, wellRested={wellRested}.

    For example, if the participant of the survey had said that they sleep 10 hours a day on average and that they always feel tired when they wake up, when the line of code 

    >>reportLink = "https://www.guidedtrack.com/programs/e4q95ez/run?hoursOfSleep={hoursOfSleep}&wellRested={wellRested}"

    gets executed, the value of the variable reportLink becomes:

    https://www.guidedtrack.com/programs/e4q95ez/run?hoursOfSleep=10&wellRested=0

    Finally, you generate the email sending this link to the participants:

    *email
	*subject: Your assessment results!
	*to: {email}
	*body
		[Click on this link|{reportLink}] to see your assessment report.

    When you test this program, you will see that you receive an email where the text “Click on this link” is a hyperlink that goes to the URL that you generated.

    In the case study we have chosen to display the report right after the survey as well. This is totally optional and we include it here to make this case study as generic as possible:

    Here are your assessment reports:

*program: case study - sleep report

Thank you for participating in our survey!

    Now, on to the code inside the report program:

    *if: hoursOfSleep < 5
	It seems that you suffer from some serious sleep deprivation!
	
*chart: Your hours of sleep compared to the average hours of sleep reported by people who participated in our study
	*type: bar
	*data: [["You", hoursOfSleep], ["Average", 8]]
	
*button: Tell me more!
*image: https://images.pexels.com/photos/1560424/pexels-photo-1560424.jpeg

*if: wellRested < 2
	Based on your answer to the question "how rested do you usually feel when you wake up?", we suggest that you discuss with your doctor how you can improve your sleep.
	
*if: wellRested = 2
	It is great that you wake up so energetic!

    As you can see, the report program uses the variables hoursOfSleep and wellRested. When this program is run from within the survey with the code *program: case study – sleep report, all of the variables in the main program (the survey) are accessible from the subprogram (the report), so it will automatically take the values that the user entered. 

    When the program is run using the link in the email, GuidedTrack automatically reads the URL parameters and generates variables with those names and values before starting to run the code in the program.  

    You can use these variables to generate customized and interactive reports based on their answers, where you can display their results in different pages, include media, generate charts and much more!

    Feel free to explore the code of these two programs and duplicate them to adapt them to meet your needs:

    https://www.guidedtrack.com/programs/17725/

    https://www.guidedtrack.com/programs/17726/

    You can also run the survey using this link to better understand how these two programs work.

     

  • Belen 3:50 pm on August 18, 2021 Permalink  

    Feature update: code editing with live preview 

    You may have noticed some changes to the GuidedTrack code editor. Until now, our website provided two tools to allow for building and testing programs: the Code and Preview views. 

    You would make changes to your program on the Code view, and then go to Preview in order to test them.

    We have now created the Split view. Check it out!

    This view runs your program alongside the editor and tracks its execution by highlighting the lines of code that have run on the page you’re looking at. If you make changes to the code, they’ll be loaded right away so you can inspect the result immediately and make further changes if necessary.

    We hope this significantly improves the editing experience when you need to make many small changes to the same spot in your program. 

     

← Older posts

Newer posts →

c
compose new post
j
next post/next comment
k
previous post/previous comment
r
reply
e
edit
o
show/hide comments
t
go to top
l
go to login
h
show/hide help
shift + esc
cancel