Difference between revisions of "About vExpo/vExpo Knowledge Base/Kiosk/Create"

From wiki
Jump to navigation Jump to search
(18 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 +
{{#css:
 +
 +
.btn {
 +
  border: none;
 +
  background-color: #FFFFFF;
 +
  padding: 14px 28px;
 +
  font-size: 12px;
 +
  cursor: pointer;
 +
  display: inline-block;
 +
}
 +
 +
.btn:hover {background: #ff9800;}
 +
 +
.cta {color: #eee;}
 +
 +
 +
p{
 +
font-family: "Noto sans", sans-serif !important;
 +
font-size: 1.0em;
 +
}
 +
 +
li{
 +
font-family: "Noto sans", sans-serif !important;
 +
font-size: 1.0em;
 +
}
 +
 +
.wrap {
 +
  height: 100%;
 +
  display: flex;
 +
  align-items: center;
 +
  justify-content: center;
 +
}
 +
 +
.button {
 +
  width: 270px;
 +
  height: 30px;
 +
  font-family: 'Roboto', sans-serif;
 +
  font-size: 13px;
 +
  letter-spacing: 2.5px;
 +
  font-weight: 500;
 +
  color: #FFFFFF;
 +
  background-color: #FFFFFF;
 +
  border: none;
 +
  border-radius: 45px;
 +
  box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
 +
  transition: all 0.3s ease 0s;
 +
  cursor: pointer;
 +
  outline: none;
 +
  padding-top: 15px;
 +
  padding-left: 15px;
 +
  margin-right: 100px;
 +
  text-transform: uppercase;
 +
  }
 +
 +
.button:hover {
 +
  background-color: #adadad;
 +
  box-shadow: 0px 15px 20px rgba(4, 97, 123, 0.4);
 +
  color: #FFFFFF;
 +
  transform: translateY(-7px);
 +
}
 +
 +
.checkbox {
 +
list-style: none;
 +
}
 +
}}
 +
<p class="button"><strong>[[About_vExpo/vExpo_Knowledge_Base|<span>'''< Back to Knowledge Base'''</span>]]</strong></p>
 +
 
{|
 
{|
 
[[File:Kiosk_Owner_Creating.png|1200px|]]</center>
 
[[File:Kiosk_Owner_Creating.png|1200px|]]</center>
 
|}
 
|}
 
{{StepbyStepMenuKiosk}}
 
{{StepbyStepMenuKiosk}}
 +
[[FR:À_propos_de_vExpo/Base_de_connaissances_sur_vExpo/Kiosque/Créer]]
 +
='''Planning and Creating a New Kiosk'''=
  
='''Planning and Creating a New Kiosk'''=
+
Kiosk owners, as outlined in the [https://wiki.gccollab.ca/About_vExpo/Roles_and_Responsibilities Roles and Responsibilities] for the vExpo, are responsible for planning and creating the final designs of their kiosks. Guidance material has been developed to support you throughout this process.
 +
Follow these 5 steps to plan and create your new virtual kiosk, utilizing our three-part video tutorial for assistance:
 +
 
 +
<ul>
 +
#Plan your kiosk (Step 1)
 +
#Design and export your kiosk panels (Steps 2 and 3)
 +
#Build and publish your kiosk (Steps 4 and 5)
 +
</ul>
  
Follow these steps to plan your new virtual kiosk. See FAQ: [https://wiki.gccollab.ca/About_vExpo/FAQ%27s Who Can Use vExpo?]
+
Refer to our [https://wiki.gccollab.ca/About_vExpo/FAQ%27s FAQ] for any questions.
  
 +
==1. Plan your kiosk==
  
'''1. Plan and complete your kiosk content'''
+
Begin by using the [https://drive.google.com/uc?id=1cXUL1z9594wC5g2IZaDmMSJHbpFQmZNE&export=download Kiosk Mock-up Creation Guide] to formulate a rough idea of your kiosk content, including visuals, interactivity, and navigation. This document covers essential topics such as recommended applications for content creation, the structure of a virtual kiosk, and steps for creating your mockup.
  
Plan your kiosk content and fill out the [https://drive.google.com/uc?id=1eNyLniPjhdAfIh6OwtUfDNyn1vjJuX8U&export=download Kiosk Content Submission Form.doc] with the final content (in both official languages) to be included in your kiosk.
+
Once you've familiarized yourself with the guide and envisioned your content, utilize the [https://drive.google.com/uc?id=1IROZ4zfw5bAjZbvD8_xhFD5qmyULIwWw&export=download Kiosk Mockup Template] to organize your kiosk content and layout. This is an opportunity to sketch and experiment before finalizing your panel design.  
  
We recommend creating a kiosk mockup to help plan and organize your kiosk content and layout. This will help you ensure you won’t overload your kiosk with too much (or too little) content, and give you a head start when the time comes to create your final kiosk design (step 2).
+
Once your kiosk mockup is completed, transfer the corresponding content to the [https://drive.google.com/uc?id=1eNyLniPjhdAfIh6OwtUfDNyn1vjJuX8U&export=download Kiosk Content Planning Template]. This tool will assist you later in the process. Ensure all planned content for your kiosk is available in both official languages, including decorative text, description card text, thumbnail images, and hotspot links.
  
*Guide: Kiosk Mock-up Creation Guide.doc – to help you plan your kiosk content and layout.
+
Resources:
 +
*Guide: [https://drive.google.com/uc?id=1cXUL1z9594wC5g2IZaDmMSJHbpFQmZNE&export=download Kiosk Mock-up Creation Guide] – to help you plan your kiosk content and layout.
  
*Template: [https://drive.google.com/uc?id=1IROZ4zfw5bAjZbvD8_xhFD5qmyULIwWw&export=download Kiosk Mockup Template.ppt] – to help you create a mockup.
+
*Template: [https://drive.google.com/uc?id=1IROZ4zfw5bAjZbvD8_xhFD5qmyULIwWw&export=download Kiosk Mockup Template] – to help you create a mockup.
  
 +
*Template: [https://drive.google.com/uc?id=1eNyLniPjhdAfIh6OwtUfDNyn1vjJuX8U&export=download Kiosk Content Planning Template] - to record your content to use later in vBuilder.
  
'''2. Design your kiosk'''
+
==2. Design your kiosk panels==
  
As per the [https://wiki.gccollab.ca/About_vExpo/Roles_and_Responsibilities Roles and Responsibilities] for the vExpo, kiosk owners* are responsible for creating and updating the final designs of their kiosks. Image specifications and guidance material have been developed to support your kiosk design journey, if required.
+
Refer to the instructions in the [https://drive.google.com/uc?id=1beYSAGT1PWPrr7cLon3bG-pdrVaWNIBI&export=download Creating Your Final Kiosk Design Guide] to transform your mockup into high-resolution panel images with consistent layout, good design, and overall balance. Utilize one of our [https://drive.google.com/drive/u/0/folders/1iXE-u7eOCoO0gbb-jygIXNgIkvhbJ24F blank canvas templates] to capture your designs in the required layout and format before exporting them as .png files. In total, you should have 8 image panels: left, central, right, and title in both official languages.  
  
'''Note:''' We recommend working with your Communications, Marketing or Multimedia team to develop the final kiosk design files. If you decide to take this on yourself, we strongly recommend obtaining Communications approval prior to submitting the final designs.
+
While you can create the required panel images using the provided guides and tutorials, you may also seek support from your department’s communications, marketing, or multimedia team.  
  
* [https://drive.google.com/uc?id=1ieXwYzqKXwr6RfpDuuqOU-9xNs6fQBUj&export=download  Kiosk image specifications]
+
Common applications for this purpose include Adobe Illustrator, Adobe Photoshop, Adobe XD, Sketch, Figma, Canva, and PowerPoint.
* Templates and guidance:
 
** Guide: Creating your [https://drive.google.com/uc?id=1beYSAGT1PWPrr7cLon3bG-pdrVaWNIBI&export=download Final Kiosk Design] – to help you create the final high resolution images for your 3D kiosk.
 
** Templates: [https://drive.google.com/drive/u/0/folders/1iXE-u7eOCoO0gbb-jygIXNgIkvhbJ24F Blank canvas] for creating final kiosk design (PPT, SVG, Figma, Adobe XD, Illustrator)
 
  
 +
Resources:
 +
*Guide: [https://drive.google.com/uc?id=1beYSAGT1PWPrr7cLon3bG-pdrVaWNIBI&export=download Creating Your Final Kiosk Design Guide] to help you create the final high resolution panel images for your 3D kiosk.
 +
*Templates: [https://drive.google.com/drive/u/0/folders/1iXE-u7eOCoO0gbb-jygIXNgIkvhbJ24F Blank canvas templates] for capturing final kiosk design (PPT, SVG, Figma, Adobe XD, Illustrator).
  
'''3. Export your kiosk image files'''
+
==3. Export your kiosk panel image files==
  
Once your kiosk designs are finalized in both official languages, export each individual kiosk panel as .png files. These will be used to create the 3D version of the kiosk. For a 3 panel kiosk, you should have a total of 8 panels (4 panels per language): left, central, right, and title.
+
Once your kiosk designs are finalized in both official languages, export each individual kiosk panel as .png files. These files will be used to create the 3D version of the kiosk.  
  
Name each image file using the following naming convention:  
+
For a 3-panel kiosk, you should have a total of 8 image panels (4 panels per official language): left, central, right, and title. Name each image file according to the following convention:
  
 
<ul>
 
<ul>
Line 49: Line 128:
 
</ul>
 
</ul>
  
 +
Resource:
 +
*Guide: [https://drive.google.com/uc?id=1ieXwYzqKXwr6RfpDuuqOU-9xNs6fQBUj&export=download Kiosk image specifications guide] to provide the exact requirements for each panel.
 +
 +
==4. Build your kiosk using the vBuilder self-serve tool==
 +
The Tech Lab has developed the Kiosk vBuilder self-serve tool to assist you in creating your virtual kiosk. Follow the instructions in the [https://drive.google.com/file/d/1mqH393Cj_ihjVqlvYLMvUZYftJA3QM2J/view?usp=sharing Kiosk vBuilder Creation Guide] to upload your panels and construct your kiosk.
 +
 +
Ensure you have all the required content ready, including the unique vBuilder link provided by the Tech Lab, the panel image files, and the content planning template with description card text and hotspot URLs.
 +
 +
If you haven't received the link to access the vBuilder, contact the Tech Lab at [mailto:techlab-labtech@csps-efpc.gc.ca techlab-labtech@csps-efpc.gc.ca] to request a new kiosk and a vBuilder link, providing details such as the event for which your kiosk will be used, the event host name, and your kiosk/organization name.
  
'''4. Submit your files'''
+
Resource:
 +
*Guide: [https://drive.google.com/file/d/1mqH393Cj_ihjVqlvYLMvUZYftJA3QM2J/view?usp=sharing Kiosk vBuilder Creation Guide] to show you step by step how to build your kiosk.
  
Send your kiosk content submission form (from step 1) with related image files for description card icons and final kiosk design files (from step 2) to the Tech Lab’s generic mailbox: [[techlab-labtech@csps-efpc.gc.ca techlab-labtech@csps-efpc.gc.ca]]
+
==5. Publish your kiosk==
 +
Once you've uploaded your panels, built your kiosk, and previewed your final product using the Kiosk vBuilder tool, contact the Tech Lab team at [mailto:techlab-labtech@csps-efpc.gc.ca techlab-labtech@csps-efpc.gc.ca] to notify them that your kiosk is ready to be published on a public-facing site. Please allow up to 2 working days for your kiosk to be published for quality assurance purposes.

Revision as of 10:08, 13 May 2024

< Back to Knowledge Base

Kiosk Owner Creating.png

Planning and Creating a New Kiosk

Kiosk owners, as outlined in the Roles and Responsibilities for the vExpo, are responsible for planning and creating the final designs of their kiosks. Guidance material has been developed to support you throughout this process. Follow these 5 steps to plan and create your new virtual kiosk, utilizing our three-part video tutorial for assistance:

    1. Plan your kiosk (Step 1)
    2. Design and export your kiosk panels (Steps 2 and 3)
    3. Build and publish your kiosk (Steps 4 and 5)

Refer to our FAQ for any questions.

1. Plan your kiosk

Begin by using the Kiosk Mock-up Creation Guide to formulate a rough idea of your kiosk content, including visuals, interactivity, and navigation. This document covers essential topics such as recommended applications for content creation, the structure of a virtual kiosk, and steps for creating your mockup.

Once you've familiarized yourself with the guide and envisioned your content, utilize the Kiosk Mockup Template to organize your kiosk content and layout. This is an opportunity to sketch and experiment before finalizing your panel design.

Once your kiosk mockup is completed, transfer the corresponding content to the Kiosk Content Planning Template. This tool will assist you later in the process. Ensure all planned content for your kiosk is available in both official languages, including decorative text, description card text, thumbnail images, and hotspot links.

Resources:

2. Design your kiosk panels

Refer to the instructions in the Creating Your Final Kiosk Design Guide to transform your mockup into high-resolution panel images with consistent layout, good design, and overall balance. Utilize one of our blank canvas templates to capture your designs in the required layout and format before exporting them as .png files. In total, you should have 8 image panels: left, central, right, and title in both official languages.

While you can create the required panel images using the provided guides and tutorials, you may also seek support from your department’s communications, marketing, or multimedia team.

Common applications for this purpose include Adobe Illustrator, Adobe Photoshop, Adobe XD, Sketch, Figma, Canva, and PowerPoint.

Resources:

3. Export your kiosk panel image files

Once your kiosk designs are finalized in both official languages, export each individual kiosk panel as .png files. These files will be used to create the 3D version of the kiosk.

For a 3-panel kiosk, you should have a total of 8 image panels (4 panels per official language): left, central, right, and title. Name each image file according to the following convention:

    1. English right panel: Kxxxxxx_EnCA_Right
    2. French right panel: Kxxxxxx_FrCA_Right
    3. English centre panel: Kxxxxxx_EnCA_Centre
    4. French centre panel: Kxxxxxx_FrCA_Centre
    5. English centre title panel: Kxxxxxx_EnCA_CentreTitle
    6. French centre title panel: Kxxxxxx_FrCA_CentreTitle
    7. English left panel: Kxxxxxx_EnCA_Left
    8. French left panel: Kxxxxxx_FrCA_Left

Resource:

4. Build your kiosk using the vBuilder self-serve tool

The Tech Lab has developed the Kiosk vBuilder self-serve tool to assist you in creating your virtual kiosk. Follow the instructions in the Kiosk vBuilder Creation Guide to upload your panels and construct your kiosk.

Ensure you have all the required content ready, including the unique vBuilder link provided by the Tech Lab, the panel image files, and the content planning template with description card text and hotspot URLs.

If you haven't received the link to access the vBuilder, contact the Tech Lab at techlab-labtech@csps-efpc.gc.ca to request a new kiosk and a vBuilder link, providing details such as the event for which your kiosk will be used, the event host name, and your kiosk/organization name.

Resource:

5. Publish your kiosk

Once you've uploaded your panels, built your kiosk, and previewed your final product using the Kiosk vBuilder tool, contact the Tech Lab team at techlab-labtech@csps-efpc.gc.ca to notify them that your kiosk is ready to be published on a public-facing site. Please allow up to 2 working days for your kiosk to be published for quality assurance purposes.