Recomendados
Recomendados
Más contenido relacionado
Similar a CSUC13 Video: Interactive Maps and Virtual Campus Tours
Similar a CSUC13 Video: Interactive Maps and Virtual Campus Tours (9)
Más de hannonhill
Más de hannonhill (20)
Último
Último (20)
CSUC13 Video: Interactive Maps and Virtual Campus Tours
- 1. Interactive Maps and Virtual Campus Tours Cascade Server User Conference Tuesday, September 17th, 2013 @BarkleyREI #csuc13
- 2. Who is BarkleyREI? Full-service interactive agency Specialize in “information and application rich” projects Decade of higher education experience (50+ clients) Extensive Cascade Server experience 25+ employees Whois BarkleyREI? @BarkleyREI #csuc13
- 3. Clients
- 4. Clients
- 5. Clients
- 6. Clients
- 7. Washburn University Virtual Tour @BarkleyREI #csuc13
- 8. Who is BarkleyREI?Whois Washburn University? Located in Topeka, Kansas 7,300+ students Founded in 1865 Named after early benefactor Ichabod Washburn @BarkleyREI #csuc13
- 9. Who is BarkleyREI?Whois Washburn University? RWD website redesign launched on Cascade Server in May 2012 School of Law RWD redesign launched May 2013 Washburn Institute of Technology RWD redesign in progress @BarkleyREI #csuc13
- 10. Website Goals Business Objectives Website Strategies Website Tactics OurApproach @BarkleyREI #csuc13
- 11. Business Objective Increase enrollment among traditional full time undergraduate students Website Goal Generate campus visits Website Strategy Showcase the campus and its facilities Website Tactic Improve the Virtual Tour @BarkleyREI #csuc13
- 12. Welcome video / intro text Map Gallery @BarkleyREI #csuc13
- 24. Making the site easy to maintain @BarkleyREI #csuc13
- 28. All Gallery Items entered on the Details pages show in the Gallery The „Must See‟, „Academics‟, „Ca mpus Life‟, etc. categories carry over @BarkleyREI #csuc13
- 29. Summary Responsive Design HTML5 Categorized Multimedia Easy content entry in Cascade @BarkleyREI #csuc13
- 30. Chapman University Interactive Map @BarkleyREI #csuc13
- 31. Who is BarkleyREI?Whois Chapman University? Located in Orange, California Founded in 1861 Nearly 7,000 students across 7 Schools & Colleges Students from all 50 states, the U.S. territories, 60+ countries RWD homepage launched Nov. 2011 on Cascade Server, full redesign live in March 2012 @BarkleyREI #csuc13
- 32. Who is BarkleyREI? @BarkleyREI #csuc13
- 33. Who is BarkleyREI?Mapfeatures Dozens of listings across 14 categories RWD Google Map Zoom Print Map vs. Satellite view
- 35. Who is BarkleyREI? @BarkleyREI #csuc13
- 37. Who is BarkleyREI? @BarkleyREI #csuc13
- 38. Who is BarkleyREI? @BarkleyREI #csuc13
- 39. Who is BarkleyREI? @BarkleyREI #csuc13
- 41. Who is BarkleyREI? @BarkleyREI #csuc13
- 42. Who is BarkleyREI? @BarkleyREI #csuc13
- 44. Who is BarkleyREI? @BarkleyREI #csuc13
- 45. Who is BarkleyREI? @BarkleyREI #csuc13
- 47. Who is BarkleyREI? @BarkleyREI #csuc13
- 49. Who is BarkleyREI? @BarkleyREI #csuc13
- 50. Who is BarkleyREI? @BarkleyREI #csuc13
- 51. Who is BarkleyREI? @BarkleyREI #csuc13
- 52. Who is BarkleyREI? @BarkleyREI #csuc13
- 54. Who is BarkleyREI? @BarkleyREI #csuc13
- 55. Summary Responsive Design HTML5 Google map Categorized Easy content entry in Cascade @BarkleyREI #csuc13
- 57. Thank You Additional questions or comments, please contact: Chris Cox, Client Services Director 412-427-7088 ccox@barkleyrei.com @BarkleyREI #csuc13
Notas del editor
- Thank you for joining us today. We’re glad you’re here, and hope you find the presentation informative. My name is Chris Cox. I’m Client Services director at BarkleyREI. This is my 4th User Conference, and second as a presenter. I might look familiar to some of you, I presented a session on Responsive Design in Cascade Server last year. My colleague Ryan Sprake is with me here today. Ryan is one of our Senior Interface Developers; he’s the person who built the 2 things we’re going to be showing today.So, why did we pick this topic? Because we know that getting prospects to visit your campus is a paramount objective for many higher ed websites. A good Virtual Tour can show off your facilities, express your personality, and help entice people to visit campus. We are going to show you a fully Responsive Virtual Tour we developed in Cascade Server with Washburn University, and will also present an innovative interactive map in Cascade that's under development for Chapman University.
- These are some of our Cascade Server clients that we’ve worked with. It’s nice to see some of them here today, glad you could be here.
- Here are some of our other Higher Ed clients…
- …and some more…
- …and here are some of our non-higher ed clients. We do a fair amount of travel/tourism work, non-profit work, and work in a few other verticals like financial services.
- So, the first thing we’re going to show today is the Virtual Tour we developed for Washburn University. Some of you may have met our client from Washburn, Mr. Shane Bartley, here over the past few days. Unfortunately his flight options were fairly limited, and he had to leave to catch his plane a little while ago. But he has said he will be happy to provide the ‘university webmaster’ point of view about any questions you may have; you can send them to me and I’ll be happy to consolidate and forward to him.
- So what does the Virtual Tour consist of? Here is our original design comp. As you’ll see, the Virtual Tour landing page has 3 main sections:The Welcome video with this intro text over hereThe Map- which was created in Illustrator/Photoshop by a very talented person at WashburnThe Gallery, which has a lot of photos and videos
- Here is a closer up screen capture of the Welcome Video/Intro text live site. Now I’ll show you what it looks like inside Cascade.
- As you can see, the content entry is pretty straightforward. Even though this content is pretty evergreen, we still wanted to make sure an entry-level content author would be capable of updating it if needed.
- So here we map out which field controls which section of the page.
- The campus map. In many ways this is the focal point of the Virtual Tour page. Site visitors can see at a glance where various campus facilities are in relation to each other. You’ll notice the tabs at the top, for different filters the user can select. By default the page loads with “Must see”, which as the name implies are things that Washburn considers the ‘highlights’ of the campus. But if a user just wants to see all the Athletic facilities, for instance, they can click on that tab and its listings will pop up. For the record, a building can be in more than one category. Each building has one unique number- if it’s #1 on Must See, it will be #1 on “Show all” as well.
- Each item on the map has a Details page in Cascade Server. We created a Content Type for them, and I’m going to show you all the different elements of that Content Type, and what controls what.
- On the Details page for each item, the Keywords field controls which categories the item displays in.
- When you click on one of the numbers, a little preview box opens telling you what the item is. It has the name, photo, brief description and a link to ‘learn more.’
- All this content is controlled very easily in Cascade.
- If you click “learn more”, you go to the item’s Details pages. The Details pages have room for a lot of content, including traditional still Photos, 360 degree panorama photos, Videos, and of course text.We carried through Responsive Design principles. What you’re seeing here is the traditional desktop view, which these days we simply call the ‘large’ view.
- Tablet size:Title/text goes under the image, not to the right, because it’s narrower now.Arrows go away, rely on finger swiping instead of clicking with a mouse“Get directions” link appears. Now, at the time the Virtual Tour was conceived and built, the thinking was that if you were ‘on the go’- such as walking around with a smartphone- you would be more likely to need directions. “Hey, I must be in the wrong part of campus, how do I get to this place?” So we added “get directions” for tablets and mobile sizes. A year and a half later, we’ve shifted and stray away from assuming device or intent at different sizes, so if we were to build this again now we’d probably recommend having “get directions” appear at all times.
- When you get even narrower, to mobile width, you’ll see the text wraps more tightly under the picture.We also removed the “Related Photos and Videos”, because of spacing concerns on such small screens. That’s another thing that, were we to redo this today, we might revisit and decide to include. I think part of the hope had been that not showing them would reduce load time on mobile, but it didn’t actually help that.
- All this content is also very easily managed in Cascade. (after showing, mention we’ll show the images in a second.)
- Now the images here are classified as Gallery Items. You have to choose a Type, which can either be ‘image’, ‘video’, or ‘panorama’. Then, you need to complete the relevant field below it, i.e. if it’s a still image you specify which image to use, if it’s a video you enter the YouTube ID, etc. You can add, delete and reorder the Gallery Items, too, thanks to this handy feature in Cascade.
- The “Related Photos & Videos” are controlled by the “Related Links” section of the template. For each, you select which Type you want, where you want it to link, and what you want its image to be.We debated whether to develop something that would select these dynamically, based on categorization. For instance, since this building is in the Academics category, pull in 4 other Academics photos, either randomly, or by ‘most recently added’, or some other criteria. Ultimately we all decided the manual control was more important, and since these pages aren’t ones that you have to update very often, the extra control doing it manually afforded was worth the additional content entry.
- The last part of the Virtual Tour landing page is the Gallery. Basically, if a user wants to look through the images and see what jumps out at them, and then click to see what it is, they can. It’s just another way to explore the Tour.
- Basically, all the Gallery Items entered on the Details pages show in the Gallery, and the ‘Must See’, ‘Academics’, ‘Campus Life’, etc. categories carry over.
- Ryan and I are joined today by Chapman’s webmaster, Mandy Thomas, who many of you may have met at last year’s conference or over the past few days. Thank you for being here today Mandy.