Changes

= Content and Design Guidelines =

= Content and Design Guidelines =

The guidelines below provide information on the content and design requirements for the development of a virtual lobby and kiosk.  

The guidelines below provide information on the content requirements and design guidelines for the development of a vExpo lobby and kiosk.  

<br>

<br>

<br>

<br>

{| style="width: 45%;"

== vExpo Content requirements ==

<p>All content to be included in a vExpo lobby and kiosks must:

| style="width: 50%" | <div style="text-align: center;">'''[https://wiki.gccollab.ca/CSPS_Digital_Academy/Virtual_Expo/Content_%26_Design_Guidelines#vExpo_Lobby Virtual lobby]'''</div>[[File:2102 lobby EN.PNG|center|250px|border|link=https://wiki.gccollab.ca/CSPS_Digital_Academy/Virtual_Expo/Content_%26_Design_Guidelines#vExpo_Lobby]] || style="width: 50%" | <div style="text-align: center;">'''[https://wiki.gccollab.ca/CSPS_Digital_Academy/Virtual_Expo/Content_%26_Design_Guidelines#Virtual_Kiosks Virtual kiosk]'''</div>[[File:3D kiosk EN.png|center|325px|border|link=https://wiki.gccollab.ca/CSPS_Digital_Academy/Virtual_Expo/Content_%26_Design_Guidelines#Virtual_Kiosks]]

<p>The vExpo lobby is designed to provide participants with easy access to the event’s content and activities, such as links to:

 

 

=== Content requirements ===

<p>All content to be included in a vExpo lobby must:

*Be '''available on the web''' (e.g. department site, GCwiki, GCpedia, Youtube, etc.) so that we can link to it directly.   

*Be '''available on the web''' (e.g. department site, GCwiki, GCpedia, Youtube, etc.) so that we can link to it directly.   

:''Note: the Digital Academy will not host any content for the lobby. However, the team can provide support to help you find the best options to make your content available on the Web. ''

:''Note: the Digital Academy will not host any content for the lobby. However, the team can provide support to help you find the best options to make your content available on the Web. ''

:''Note: The CSPS Digital Academy is committed to offer content and products that are fully accessible and inclusive. Content that does not meet accessible requirements will not be included in the lobby (e.g. no PDFs will be accepted).''

:''Note: The CSPS Digital Academy is committed to offer content and products that are fully accessible and inclusive. Content that does not meet accessible requirements will not be included in the lobby (e.g. no PDFs will be accepted).''

  </p>

  </p>

 

<p>The vExpo is available publicly on the Web for anyone to see and access. By default, all content available from the lobby and kiosks should:  

<p>The vExpo is available publicly on the Web for anyone to see and access. By default, all content available from the lobby and kiosks should:  

*have open access to be viewed publicly, without login or restricted permissions.  

*have open access to be viewed publicly, without login or restricted permissions.  

*have the appropriate copy rights to be shared publicly.

*have the appropriate copy rights to be shared publicly.

:''Note: Although we do not recommend it, it is possible to restrict access to GC employees by hosting your content on a GCpedia page, which can only be accessed when on the GC network.''</p>  

:''Note: Although we do not recommend it, it is possible to restrict access to GC employees by hosting your content on a GCpedia page, which can only be accessed when on the GC network.''</p>  

{| width="100%" cellpadding="10" cellspacing=15px

{| width="100%" cellpadding="10" cellspacing=15px

|style="border-left: 10px solid #3f2a56; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: black; background-color: white; font-size:1em;" |  

|style="border-left: 10px solid #3f2a56; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: black; background-color: white; font-size:1em;" |  

=== <big>What we need from you</big> ===  

=== <big>What we need from you</big> ===  

<p>To help us develop the virtual lobby within the required timeframe, we will need you to provide the following items:</p>

<p>To help us develop the virtual lobby within the required timeframe, we will need you to provide the following items:</p>

<p>Note: You may need or want the lobby to reflect the look and feel of the event's visual branding (ex: promotional material). If there are additional visuals, logos, etc. that should be included in the event's visual design, make sure to let us know and send us the source files along with the content submission template (optional). </p>

<p>Note: You may need or want the lobby to reflect the look and feel of the event's visual branding (ex: promotional material). If there are additional visuals, logos, etc. that should be included in the event's visual design, make sure to let us know and send us the source files along with the content submission template (optional). </p>

<div class="btn">[[Media:VExpo_Content_Submission_Template_Lobby.docx|vExpo Lobby Content Submission Template (download Word file)]]</div>-->

<div class="btn">[[Media:VExpo_Content_Submission_Template_Lobby.docx|vExpo Lobby Content Submission Template (download Word file)]]</div>

|}

|}  

 

 

 

 

{| width="100%" cellpadding="10" cellspacing=15px

{| width="100%" cellpadding="10" cellspacing=15px

|style="border-left: 10px solid #3f2a56; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: black; background-color: white; font-size:1em;" |  

|style="border-left: 10px solid #3f2a56; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: black; background-color: white; font-size:1em;" |  

 

=== <big>What we need from you</big> ===  

=== <big>What we need from you</big> ===  

❏ Kiosk title (English and French)<br>

❏ Kiosk title (English and French)<br>

<br>

<br>

<div class="btn">[[Media:VExpo Content Submission Template Kiosk.docx |vExpo Kiosk Content Submission Template (download Word file)]]</div>-->

<div class="btn">[[Media:VExpo Content Submission Template Kiosk.docx |vExpo Kiosk Content Submission Template (download Word file)]]</div>

|}-->

== Additional information ==

== Kiosk Design Guidelines ==

<p>The virtual kiosks are used to provide users with an overview of a department’s or group’s mandate, projects and/or initiatives. To have a successful product, here are some key considerations when gathering and submitting content to be included in your kiosk.</p>

<p>The virtual kiosks are used to provide users with an overview of a department’s or group’s mandate, projects and/or initiatives. To have a successful product, here are some key considerations when planning the content and design of your kiosk.</p>

=== General layout ===

=== General layout ===

</p>

</p>

<br>

<br>

<p>'''Hotspots:''' Any of these elements mentioned above will be converted into a hotspot ( link) that viewers can click on to navigate to the target destination (i.e. Website), which is the actual content we want people to see. Each hotspot is accompanied by an information card that appears at the bottom of the screen on mouse-over (when the viewer’s cursor hovers over the hotspot). This information card includes a descriptive text and icon, and is used as a call to action, explaining why they should click on the link (e.g. Learn about the Discover Series. Visit the Website,). The text and icon used within the information card is also re-used for the mobile and accessible version of kiosk.

<p>'''Hotspots:''' Any of these elements mentioned above will be converted into a hotspot ( link) that viewers can click on to navigate to the target destination (i.e. web page, youtube, presentation, etc.), which is the actual content we want people to see. Each hotspot is accompanied by an information card that appears at the bottom of the screen on mouse-over (when the viewer’s cursor hovers over the hotspot). This information card includes a descriptive text and icon, and is used as a call to action, explaining why they should click on the link (e.g. Learn about the Discover Series. Visit the Website,). The text and icon used within the information card is also re-used for the mobile and accessible version of kiosk.

[[File:Kiosk hotspot desc cards.png|center|350px]]

[[File:Hotspot lobby.png|center|350px]]

<div style="text-align: center;">''Example of a hotspot and its description card.''</div>

<div style="text-align: center;">''Example of a hotspot, its description card and how it translates to the mobile view.''</div>

</p>

</p>