In this article, I will be discussing how to format questions and answers in Easy Quiz Maker for output to a printer.  For example, you may want each question to display the number, category or change the headers on each page.   This is possible along with many other settings in the print output settings.  Start by creating a printed quiz and add a few questions (if you have not done so already).  Select the quiz in the Quiz Development Area under the Your Quizzes tab and click Print this Quiz.   Now click the Setup Printer and Output Options button. 

This will take you to the Page Headers tab.  From here, you can change the quiz header font, title visibility etc.  You can also input variables like the date and time in the description below the title if desired.   For this example, I will check the “Print Page1 Header“ box, click the Variable button and select the %DATE% variable.  

Now that the Page Headers are set up, click the Question and Answer Style tab.  Under the Question Sub tab, check the box to Prefix Question Text with Categories. 

Now click the Choices sub tab, uncheck the box that says “Choice Letter” and click the Explanation sub tab. 

Format the explanations if desired and click Apply. 

Note: These settings will apply to all printed tests unless modified again before printing

Click Yes to print a Simple Answer Key and click Next.  Select the questions you would like to enter in the test and click Print.

In this tutorial, I will be explaining how to modify the CSS properties for the selectors discussed in the previous article.  Click here to view “CSS for Quiz Templates Explained Part 1.”  All colors in CSS are referred to using Hexadecimal format ex. #FFFFFF.  Most image editing software will provide Hexadecimal values when a color is chosen.  If you do not have image editing software, you may want to download a color picker to choose or get the color value from an image (You will find several pickers if you search Google for “free color picker”).  To learn about CSS syntax and terminology to help complete this exercise, visit this link http://www.w3schools.com/Css/css_syntax.asp

Start by creating a quiz, put the quiz into a course and add a student.  Now upload a logo to Weblearning (Files>Browse>Upload File).   Click the Modules tab > Properties and select your logo from the banner drop down box. My logo has a background-color of #EAEAEA so I will change the background-color of the quiz template to match.  Click the Modules tab > Properties > Advanced Settings tab, locate the Extra CSS input field

Paste the following.

body{    

background-color:#EAEAEA;    

}

Thats it!  Just replace your background-color with the hexadecimal value desired and click Submit Changes.  

Navigate back to the Extra CSS input field.  Now change the background color of the content area to white.  Paste the following below the code already entered. 

#content{    

background-color:#FFFFFF;    

}

If you preview your quiz, (Courses tab > Portal) you will notice that some of the borders are white and may not show up well on the new background.  To change the top and bottom border color and style, paste the following.

#header_bar{    

border-style:solid;    

border-color:#333333;    

border-width:1px;   

}    

#navbar{
border-top:0px;
} 

The border of #header_bar will appear solid, grey and 1px wide.  The top border of #navbar will not be visible because its width is 0 px.  You can add as many CSS properties for a selector (ex. #header_bar) as you would like but each line must end in semicolon as shown above.  

The last item I will change is the color of the question font and size.  Paste the following code

.tp_question {    

font-family:Verdana, sans-serif;    

font-size: 16pt;    

color:#000066;    

}

Click Submit Changes and preview your quiz template customizations.  Your new template should look something like below

If you would like to make other changes, you can visit http://www.w3schools.com/css/css_reference.asp to review all css properties and descriptions

In this article, I will show you how to make a web quiz with Easy Quiz Maker.

Note that if you are using Online Quiz Maker, the process is nearly identical, although you will have more options that will be shown in some screen captures below. Also, in Online Quiz Maker, simply change the ‘Web Quiz‘ style mentioned in the tutorial for ‘HTML Quiz‘ when following the instructions in the tutorial.

There are many options and settings during the process, so to keep this article size within reason, I will be creating a web quiz that does the following:

• Collects the student’s name and email address
• Shows the student a complete report at the end (question summary, score, etc.)
• Emails me the result as a complete report exportable to Excel

In this example, I will be using the ‘Sample WEB Quiz‘ that is included with the Easy Quiz Maker installation (you can use your own quiz, however).

Fire up Easy Quiz Maker, select a quiz, and then click Publish > Web Quiz from the task panel:

Like I mentioned, there are various settings you can configure on the web quiz, but for this article, I will be simply entering the quiz title ‘Sample WEB Quiz’ and clicking the PUBISH button:

Now, tick the ‘Yes I want the score results emailed” option, and enter in your email address. Also, I have checked the “Email Address” checkbox (the Name checkbox is always checked) in order to ask the student for their name and email address. I have also left the ‘complete summary‘ option at default (so student will see their full results upon completion of the quiz).

Click OK, then proceed to the published quiz (which is in PUBLISHED QUIZZES > WEB QUIZZES). The web quiz will be previewed along the bottom. You can take the quiz right there, but instead, so you can see exactly what your student will see, click the “Open with Web Browser” option.

If it opens in Internet Explorer, make sure you click the security bar along the top, and choose ‘allow blocked content‘. Note that this security bar will not appear when students access the quiz from a web server.

You will notice the quiz (which is very plain for this example - like I mentioned, I did not apply any styles or colors/etc, to the visual output in order to keep this article at a reasonable length) asks for the student name and email address. I will fill everything out and submit my responses (wearing my ’student’ hat), and as you can see, a summary appears (just as I setup):

Ok, now let’s put our ‘teacher‘ hat back on. When s student completes the quiz, the report gets emailed to you (or, to the email address you told it to). So, here is what I received from the quiz completion in my email:

Note the “View Results as Excel Spreadsheet” button. When I click on it, I am given the option to download the Excel document. To get the document, right-click on the link, and select ‘Save Target As ..”, and save it into a folder that you can easily access.

In my example, I created a folder named ‘quiz scores‘ inside of ‘my documents’.

When all of the students have completed the quiz, download the Excel Score Document for each student, making sure you place them into the same folder. Then, you can merge them all together using the Easy Quiz Maker Excel Merge Tool:

Browse to the folder that contains all of the Excel Score Documents, and then click MERGE:

Once you open the spreadsheet, you can perform quite a bit of analysis on the data by clicking DATA > FILTER > AUTOFILTER.

*** UPDATE ***

Online Quiz Maker is Now Available

For more information, click here.

*** UPDATE ***

~

With Easy Quiz Maker now available (our first product in the ‘Quiz Maker’ series), our newest product, almost ready for release, is Online Quiz Maker.

Online Quiz Maker is the next step up from Easy Quiz Maker. Online Quiz Maker is designed to appeal to the same audience as our Test Pro Developer PROFESSIONAL edition - those needing to create Online Quizzes (like HTML, ASP, PHP or SCORM).

Quiz Maker Software

The main goal of Quiz Maker series is ease of use. While Online Quiz Maker shares many of the same features of Test Pro Developer PROFESSIONAL (plus a few extras, and minus a few rarely used), actually using those features in Online Quiz Maker should be significantly easier.

The main features of Online Quiz Maker are to be able to quickly and easily create quizzes you can use online — including ASP and PHP Server Quizzes, SCORM/LMS compatible quizzes, and HTML quizzes (surveys as well).

Here is a screen shot of the Online Quiz Maker main interface where you can create and work with quizzes (notice the similarity to Easy Quiz Maker).

Try Online Quiz Maker

Online Quiz Maker is in its final beta stage now, and therefore, we are offering it as a public beta. This means you can get an early preview of the software right now. The remaining tasks (for us) are to finalize bug testing, and finalize the PDF and Online Documentation.

Download Quiz Maker

To download the Online Quiz Maker beta (the download is under 6MB), simply click here.

Note that Online Quiz Maker requires Windows XP SP2 (or later), or Windows Vista.

Click here to download Atrixware Online Quiz Maker

and Click here to download the PDF Documentation

In this article, I will be discussing how to create a survey in Basic Survey.  Start by logging into your BasicSurvey account and click Get Started Now: Create Your First Survey. 

Creating a survey is broken down into 5 steps listed below.

1.  Create Questions

2.  Setup Survey (Look and Feel)

3.  Create the Survey

4.  Taking the Survey

5.  Turn on Email Reporting

Step 1 - Create Questions

Begin by clicking Create Questions or Add Questions on the left. 

Select the answer set you would like to use then enter your question. 

Give the question a category (or select from a list of categories) and click Add Question. 

Repeat this process until you are satisfied with your question list.   

Step 2  - Setup Survey (Look and Feel)

Click Look & Feel on the left and select the appropriate choices. 

For this example, I will leave the default settings as is and click Submit Changes. 

Step 3 - Create the Survey

Select Create Survey on the left and click the Create Survey link. 

Click Create - this is a new survey and enter a name.  Select the number of questions from each category and click Publish Survey. 

Step 4 - Taking the Survey

Click the Survey tab and you will see a list of your published surveys.  Click the Links and click the “Click  here to try the link” to take your survey. 

Step 5 - Turn on email reporting for the surveys

Click the Account tab and select Response Report from the Email Responses drop down box.

Note:  All survey responses will be sent to the email address listed under the Account tab

In this article, I will be going over how to create a printed quiz in Easy Quiz Maker.  Start by opening Easy Quiz Maker (or if opened, click Quiz Development > Your Quizzes Tab) and click Create a New Quiz in the Task Panel.  

Select Printed Quiz from the window, enter a name and click Finish. 

Your new quiz will now appear in Quiz Development > Your Quizzes.  Select the quiz and click the Question List tab. 

Click Add a Question, select the Multiple Choice style question and click Add Question.  Enter the question, check the box for the correct answer and click Next. 

Click Add Question to add another question and click Done when complete. 

Now that the quiz development is complete, select the quiz and click Print the Quiz in the Task Panel. 

Select the simple or verbose answer key if desired, enter the number of copies and click Next.

Note:  There are many formatting and printing options available in the Setup Printer and Options Output dialog.  For this tutorial, I will leave them as is.

Select the number of questions per category (randomly generated) from this quiz to print or use the default configurations (all questions) and click Print.

In this article, I will be discussing what each css name will modify for quiz templates in Weblearning 9. I will also note some property modifications that would be commonly used. In Part 2, I will be discussing how to make these changes using CSS properties.

What is CSS?

CSS will allow you to “style” web pages. (change font color, size, background color etc.) Since Weblearning is a web application, the same principles will apply for customizing quiz templates. Each template already has CSS applied to it giving it a look and feel. If you want to modify a template for example to change the color scheme to match company colors, you would override the current CSS with your own in the Weblearning Control Panel (discussed in Part 2).

CSS Syntax

Here is a basic outline of how the code should be formatted with an example

Terminology

selector {

property:value;

}

Example

body{

color:#FFFFFF; 

}

CSS Template names and descriptions

Note: Sections highlighted in red represent what the name (class or id) will control.

.navbutton: the next, back and end buttons on the bottom of the template. Common Modification: Change the width, height, font or color

.q_essaytext: essay style question text. Common Modification: Change the font size, font color or background color

.q_fibtext: fill in the blank style question text. Common Modification: Change the font size, font color or background color

.q_picklist: the picklist question style. Common Modification: Change the width, font size, font color or background color

.q_matching_text: the matching question style. Common Modification: Change the width, font size, font color or background color

.q_matching_picklist: the matching picklist question style. Common Modification: Change the width, font size, font color or background color

.q_title_bar: the question title bar. By default will display the question number. Common Modification: Making it invisible, modifying the font, color, height and width

.tp_body: this style will apply as a default for everything inside of the template if there is no style defined. Common Modification: background color and default font

.tp_choiceb: question answers. Common Modification: font, size and color

.tp_question: the question text. Common Modification: font, size and color

#content: box that holds the question title bar, the question and answers. Common Modification: background color, background image and border

#header_bar: holds the timer and the quiz title. Common Modification: background color and border

#navbar: holds the navigation buttons at the bottom. Common Modification: background color and border

#logo_container: holds the logo image at the top of the template. Common Modification: Align to left, right or center

In this article, I will be discussing how to add a Flash button into your CD Menu Maker project.  I will be using a button that is included in the Flash library.  However, you will not need to own a copy or know how to use Flash to include a Flash button.  There are many places online to download, create and customize your own buttons.

Click Here to download the button that I will be using if you would like to follow along.

Open CD Menu Maker and Create a New Project.  The first step is to add the Flash button to the project.  Click Project > Add/Remove Project Files in the Project Menu. 

Click Add File or Resource and browse your file system to locate your button. 

Click OK then Done to return to the Design Environment.  In the Add Components panel click the Video Component button, give it a name and click OK.  Click Pick, select the Flash button, uncheck the Show Control Button and click OK. 

Click Preview in the Project Toolbar to make sure the Flash button appears.  You will notice that the button takes on the size of the Video component. 

Close out the Preview window and return to the Design Environment.  Resize the Video component by dragging the size handle or right clicking on it in the Component Explorer and selecting Advanced Properties.   Once the component is sized appropriately, you can add Actions to the click event, duplicate the component etc.

In this tutorial I will be discussing how to animate a component in CD Menu Maker or VEDS with easing.

Note:  All screenshots and paths are for CD Menu Maker but can easily be applied to VEDS. 

Easing will create a more realistic looking animation as if the object was reacting to the forces of gravity.  Click here if you would like to look at an example of a ball bouncing with and without easing.

There are a few main concepts that you will need to understand before we start. 

1.  The animation will be time based so we will need to set the EventTimer to fire 20 times per second to get smooth motion.   

2.  A number will need to be updated to add/subtract a certain amount to move the image position every time the EventTimer is fired.  (This will create an animation without easing)

3.  An equation will be defined to have the image pick up/loose speed by multipyling or dividing the position.  (This will add easing to our animation)

Now that the theory is out of the way, we can get started.  The first thing to do is add an image component and name it Image1.

Step 1: Setting the Initial Left Position of the Image

Once your image is on the Canvas, move it to a position on the right side.  Now get the Left position of the image.  Right click on the image component in the Component Explorer, select Advanced Properties and remember the left coordinate

This number will be the starting left point for the animation.  Next click on the Canvas, click Events >  select {Global Code} > click the Code Editor button.

Now create the variable that will hold the left position value.  Paste the code below and change the left position number to left coordinate that was retrieved above.

 

dim leftPosition 

leftPosition = 500

Step 2:  Setting the EventTimer

The event timer will have to be set when the application starts to determine how may times it will fire in milliseconds (entering a value of 1000 will fire every second).  Select the frmCanvas, right-click and select On_frmCanvas_Load to open the code editor.  I want my animation to fire 20 times per second so I will enter the following:
frmCanvas.EventTimer.Interval = 50

Step 3:  Moving the Image Position

Now that the EventTimer is set, I will need to decrement the leftPosition variable by 1 every time it is fired (20 times per second).  Select the frmCanvas, right-click and select On_frmCanvas_EventTimer to open the code editor. 

You can simply put the following to move the image across the Canvas no easing.

 

leftPosition = leftPosition - 1 

Image1.Left = leftPosition

However, the image will continue to move without a stopping point.  To stop the image at 10, you will need to say…

If leftPosition > 10 Then 

leftPosition = leftPosition - 1 

Image1.Left = leftPosition 

End If

Once the image position is less than 10, the leftPosition variable will not decrement anymore and the animation will stop.  Preview your project to make sure the animation works properly.

Step 4:  Adding Easing

Now that the image is animating across the canvas, we will just need to make a slight modification to the code above.  Right now there is an image that moves to the left 1 pixel 20 times per second and stops when it is < 10.   Now the image needs to start off moving fast and slow down as it nears 10.  This is done by multiplying the leftPosition by a decimal value of .85.  The decimal value will determine how fast the image will move across the canvas.  (The lower the value, the faster the animation)  Delete any existing code and paste the code below:

If leftPosition > 10 Then 

leftPosition = (leftPosition - 1) * .85 

Image1.Left = leftPosition 

Image1.Refresh 

End If

Preview your project to confirm the image animates with easing.  If you would like to view the finished animation, you can download it here: easing.zip

*** UPDATE ***

Easy Quiz Maker is now available. Click here for more information.

***

~

Our newest product, almost ready for release, is Easy Quiz Maker.

Easy Quiz Maker is designed to appeal to the same audience as our Test Pro Developer Academic edition - those needing to create Printed Quizzes, Microsoft Word Quizzes, or Auto-scoring Web Quizzes.

Quiz Maker Software

The main goal of Easy Quiz Maker is ease of use. While it shares many of the same features of Test Pro Developer Academic (plus a few extras, and minus a few rarely used), actually using those features in Easy Quiz Maker should be significantly easier.

The main features of Easy Quiz Maker are to be able to quickly and easily create quizzes you can print, or publish into Microsoft Word, or to create web quizzes that score the quiz and optionally email you back results.

Here is a screen shot of the Easy Quiz Maker main interface where you can create and work with quizzes.

Try Quiz Maker

Easy Quiz Maker is in its final beta stage now, and therefore, we are offering it as a public beta. This means you can get an early preview of the software right now. The remaining tasks (for us) are to finalize bug testing, and finalize the PDF and Online Documentation.

Download Quiz Maker

To download the Easy Quiz Maker beta (the download is under 6MB), simply click here.

Click SAVE (if prompted), and then run the installer. Note that Easy Quiz Maker requires Windows XP SP2 (or later), or Windows Vista.

Click here to download Atrixware Easy Quiz Maker

Click here to download the Atrixware Easy Quiz Maker Manual