8,514 bytes added
, 12:45, 23 November 2023
{{#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:KioskOwnerEditing1.png|1200px|]]</center>
|}
{{StepbyStepMenuKiosk}}
{| width="100%" cellpadding="35" cellspacing="10px"
|- valign="top"
| style="border-left: 10px solid #695282; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: #57416C; background-color: white; font-size:1em;" |
<div style="column-count:1"> <div style="text-align: left">
=Kiosk Owner=
{{#css:
.img-banner{display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.img-banner div:nth-of-type(2){
background-color: #E4E6EA;
padding: 2em;
}
}}
<div class="img-banner">
<div>
[[File:Ko1.png|350px]]
</div>
<div>
<big>'''As kiosk owner, your main responsibility is to design your kiosk and integrate your final visuals and content into the Kiosk vBuilder self-serve tool to create your kiosk.'''
'''For the development of a kiosk, your role will be to:'''</big>
</div>
</div>
{{#css:
.container-horizontal{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-evenly;
}
.container-horizontal>a{
margin: 1em;
background-color: rgb(105,82,130);
border-radius: 12px;
padding: 0.5em 1em!important;
color: white!important;
width: 100%;
text-align: center;
background-image: none!important;
font-size: 1.6em;
font-weight: 600;
}
.round-list ol {
list-style: none;
counter-reset: item;
display: flex;
flex-direction: row;
align-items: stretch;
}
.round-list li {
counter-increment: item;
display: flex;
flex-direction: column;
background-color: #E4E6EA;
padding: 3em 1em;
margin: 1em;
align-items: center;
flex: 1 1 0px;
}
.round-list li:before {
margin-right: 10px;
content: counter(item);
background-color: rgb(105,82,130);
border-radius: 50%;
color: white;
width: 1.2em;
text-align: center;
display: inline-block;
position: absolute;
padding: 1em;
margin-top: -4.5em;
height:1.2em;
}
.round-list ol:nth-of-type(2) {
counter-reset: item4;
counter-set: item4 4;
}
.round-list ol:nth-of-type(2) li{
counter-increment: item4;
}
.round-list ol:nth-of-type(2) li:before{
content: counter(item4);
}
.imagelink a{
display: flex;
flex-direction: column-reverse;
align-items: center;
color: white!important;
}
.imagelink a:before{
content:'Testing Things';
margin: 1em;
background-color: rgb(105,82,130);
border-radius: 12px;
padding: 0.5em 1.3em!important;
color: white!important;
text-align: center;
background-image: none!important;
font-size: 1.6em;
font-weight: 600;
}
.imagelink.host a:before{content:'Event Host';}
.imagelink.owner a:before{content:'Kiosk Owner';}
.imagelink.techlab a:before{content:'Tech Lab';}
}}
<div class="round-list">
# Coordinate with your team, management and departmental communications team, what content and visuals should be included in your kiosk.
# Create the final kiosk design, following the kiosk design guidelines. <br><br>[[About_vExpo/vExpo_Knowledge_Base/Kiosk/Create#2._Design_your_kiosk|Link: Kiosk Design Guidelines]]
# Translate and request a linguistic review of all final kiosk content.
# Ensure that all content available through the kiosk meets the content requirements. <br><br>[[About_vExpo#vExpo_Content_Requirements|Link: vExpo Content Requirements]]
<div class="break"></div>
# Obtain final approvals from management and your internal communications team on the final kiosk content and design.
# Create your 3D kiosk using the vBuilder self-serve tool.
# Review the live version of your kiosk (in a test environment) and give the go-ahead to publish the kiosk.
# Keep your kiosk content up to date using the vBuilder self-serve tool.
</div>
<br>
|}
{| width="100%" cellpadding="35" cellspacing="10px"
|- valign="top"
| style="border-left: 10px solid #695282; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); color: #57416C; background-color: white; font-size:1em;" |
<div style="column-count:1"> <div style="text-align: left">
=Tech Lab=
{{#css:
.img-banner{display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
}
.img-banner div:nth-of-type(2){
background-color: #E4E6EA;
padding: 2em;
}
}}
<div class="img-banner">
<div>
[[File:Tl1.png|350px|techlab]]
</div>
<div>
<big>'''The vExpo team is responsible for the technical development of the vExpo event platform, including the virtual lobby and kiosks.'''
'''When working with us to get your vExpo ready for your event, our role will be to:'''</big>
</div>
</div>
{{#css:
.container-horizontal{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-evenly;
}
.container-horizontal>a{
margin: 1em;
background-color: rgb(105,82,130);
border-radius: 12px;
padding: 0.5em 1em!important;
color: white!important;
width: 100%;
text-align: center;
background-image: none!important;
font-size: 1.6em;
font-weight: 600;
}
.round-list ol {
list-style: none;
counter-reset: item;
display: flex;
flex-direction: row;
align-items: stretch;
}
.round-list li {
counter-increment: item;
display: flex;
flex-direction: column;
background-color: #E4E6EA;
padding: 3em 1em;
margin: 1em;
align-items: center;
flex: 1 1 0px;
}
.round-list li:before {
margin-right: 10px;
content: counter(item);
background-color: rgb(105,82,130);
border-radius: 50%;
color: white;
width: 1.2em;
text-align: center;
display: inline-block;
position: absolute;
padding: 1em;
margin-top: -4.5em;
height:1.2em;
}
.round-list ol:nth-of-type(2) {
counter-reset: item4;
counter-set: item4 4;
}
.round-list ol:nth-of-type(2) li{
counter-increment: item4;
}
.round-list ol:nth-of-type(2) li:before{
content: counter(item4);
}
.imagelink a{
display: flex;
flex-direction: column-reverse;
align-items: center;
color: white!important;
}
.imagelink a:before{
content:'Testing Things';
margin: 1em;
background-color: rgb(105,82,130);
border-radius: 12px;
padding: 0.5em 1.3em!important;
color: white!important;
text-align: center;
background-image: none!important;
font-size: 1.6em;
font-weight: 600;
}
.imagelink.host a:before{content:'Event Host';}
.imagelink.owner a:before{content:'Kiosk Owner';}
.imagelink.techlab a:before{content:'Tech Lab';}
.round-list.seven-list ol:nth-of-type(2) li:last-child {
visibility: hidden;
}
}}
<div class="round-list seven-list">
# Establish the vExpo submission deadlines.
# Adjust the lobby colors to match the event’s look and feel, as needed.
# Integrate the visual elements (banners and presentation screen), text and links to content as part of the lobby.
# Work directly with event hosts and kiosk owners to update their lobby and kiosks, as needed.
<div class="break"></div>
# Provide the final vExpo event and kiosk URLs prior to the event.
# Provide analytics on the use of your vExpo following the event.
# Support you and answer your questions throughout the various stages of the process.
#.
</div>
</div>
<br>
|}