Implementing Augmented Reality

An easy and inexpensive way to create augmented reality is to use the app on iOS called Aurasma. Once you have downloaded the app, you then need to create an account and also create an account on your computer with “Studio for Aurasma”. Once you have that, you can create a new aura. This is where you will upload the trigger image. The trigger image should be relatively simple and straight forward, however, I have my name on my card as the trigger image and that works. Once you select the image, you can mask out everything around that image. For example, I removed all of the other words and the frame, so only the name is the trigger. Here is how to view what it will look like:

card side 1 When you download Aurasma, and go to the studios website, you have to favorite the my auras, then when you hover over this image, you will see various icons to contact me.

Now, back to creating!  You have your trigger image in place, now you need to determine what you want to appear one the trigger is “pulled” so to speak. I have a linked in icon, a Facebook icon, an email icon, and a website icon, all of which link to my personal accounts. So you can add different icons, but you will have to download the icons and save them in order to upload them. Once you upload the image, you can add an action. if you want to do a mailto, remember it must say “mailto:myemail@mail.com” without the quotes of course. Otherwise, just add in hyperlinks to the different websites or social media sites. I know this is a very broad overview on how to do this, and if there is enough interest, I can generate a short micro training video demonstrating how to create different auras. so please let me know what you think, or if you have any questions. Happy reality!

 

Advertisements

Prototyping and Design Experiences

Turning Ideas into Reality by Nick Floro

Completely unformatted notes below:

Sketching a mock-up

– help tell a story and explain a concept to stakeholders – get fancy, use colors

  • Buttons, text = squiggly
  • Accordian – touch button that expands
  • Hamburger menu (Designers don’t like this- it implies additional navigation), play button,  blind/modal= alert or a warning
  • req’s- text on top- so be aware of real estate on a mobile device. They wanted multiple choice, drag and drop, and photos. Take a photo of your sketch on your phone

Free app: office lens- allows you to take a picture from the side and squares it off and you can safe it various ways- as pdf.

-templates: phone, tablet, and screen. We work with stakeholder and audience- show the users feedback as early as possible, after a conversation on what they needed or want. You want to share with the users, what you are doing, get buy-in and feedback, start with 20 users, then narrow down to 10. Then when you get to development and launch, everyone is happy.

Brainstorming- sticky notes, we each have a different color, or you can use “post-it, the app, you can take a photo of your post-its and move it around, or organize the post-its. its only $4 and great for online collaboration.

Taking to audience and stakeholders: What are you goals, what is the challenge/problem you are trying to solve? What are the options (timelines- which tools and techniques work with this audience, in order to creat a better experience for the learners)

Come up with a plan!

Present, Feedback, Develop (Agile Process)

3 Key factors when you start to design and prototype:

  1. Audience: computer, iPhone, touch screen?
  2. Technology: does your LMS, LRS work with the technology
  3. User stories; translate what you learned about the audience whit tecnology in mind. Describe how a user would go through the process and what would the user achieve.

Ask Why! DO they want it mobile friendly? DO they Have mobile devices.

Brainstorming session, have just one person taking notes, not everybody.

Sharing what works. Context, and content strategy (what is the audience using? Consider the rotating of the device, how does that affect the usability of where the buttons are. If you rotate and buttons move to top of screen, that is annoying

Keep it Simple. MVP- Minimum Viable Product (software development term) What is the basic functionality that we need to launch the product/course/app. We can add bells and whistles in phase 2 or 3.

Mobile apps:

Adobe Illustrator Draw- sketch on phone or tablet.

Paper by Fifty Three for iOS- Draw on your mobile device – easy for sketching- they sell a pen for about $30.

If you have a Microsoft surface pro or iPad pro. it has a pen to sketch and draw.

Notebook programs Take a pic of screen and sketch it u on iPad, then screen share with your Web Ex

Sketchbook- similar to photoshop as it has layers you can turn on and off. Free or a few bucks for cloud storage and additional features.

Carbo: Handwriting – you can draw, and lasso part of your image and move it around or reposition on the screen. Has filters too

Using mobile devices you can share.

Marvelapp.com– web based prototyping product that uses chrome/firefox. Name project- add some designs. photo of hand sketch, or grab pen tool…add multiple screens. you can add links between the screens. You can add transitions between the links. Touch and hold- Free for up to three projects at any time. and users can share/email. Pretty cool touch navigation.

Wireframing (Low and high fidelity) – translate sketches into real screens. Prototyping screen with boxes and words.

Keynote/power point are great tools.

“this is my question, here are the answers, here is an image on the right”

This is a good way to show stakeholders what happens when there is too much on a screen for mobile device.

Keynote Kung-Fu – library of images and objects to start prototyping faster, buttons, accordions, etc. $12 toolset.

**Best: Keynotopia 12-150. Templates and entire library. Simple, you can edit the objects like button names.

Keynote template for wire framing. includes his buttons, notes, images, etc. (Add link – to hyperlink)

Power Point and Keynote allow for interactivity. Hyperlinking between slides (same as Marvel app) but i can export it as a pdf to the stakeholders so hey can see how they like it. Not necessary to program it these days.

Sketchy & imockups: not the best tool, but good to experiment as an option.

Envision app.com allows you to prototype on the web and share a link so stakeholder can try on their computer- managed environment, a team can collaborate and provide feedback. Great for larger projects with lots of people involved

Proto.io– advanced prototyping tool swipe, inch and zoom, three fingerr touch.

Adobe Acrobat- link tool called add link. add same navigation as in keynote.

Sketch- best app for a mac ever. Keynote/power point/ photoshop and illustrator in one product. Lots of ux designers use this today $99

Craft for Photoshop or Sketch app- a plugin from envision.  Good for designing for a platform. Design an ecosystem and ou want to design tiles for courses we might have. Fills in with real data. offers step and repeat… so “make what i just made again”

Adobe XD experience Design, included in cloud environment subscription. Zoomed out sketch board. quick and fast to navigate through different panels.

Start to create content-

Screenshot/screengrab- as you are looking at things to build a library of image.

Understand how to interact with our devices, finger motions, etc. using your fingers makes you feel more connected with the content, rather than using the mouse. Most devices support up to 11 touch points. So how can you use those to creat more interesting content.

User Experience: how does the user feel as they interact with the content. I want them to smile, add some emotion in the course!

Responsive design: Tools like captivate allow us to do this. Uses pixel size depending on device. If videos are not accessible on phones, without wifi, remove the video- so be aware of what happens on each device.

Get Skeleton.com– build standard html page, it will rearrange your content based on orientation of the device- they use get bootstrap.com from Twitter, but also has build in UX, “add alert box, or menu”. It optimizes for different templates, and devices. Can rearrange panels for phone versus desktop.

Parallax- technique where you can tell a story with the user scrolling up and down, like facebook. Look at marketing for product called “Home” Different elements come to life as you scroll, so it keeps the users attention. Apple Retina 5k site is pretty cool. Do research- Apple has some great design- borrow from their text, layout, etc.

Design for Flexibility, how will the user update the content if the course changes: UI/UX: Apple weather app, forecast, etc. look at the Yahoo father app. It just has an image, high, low where you are. (Shows key data) scroll down to “dive deeper”

Swipe left or right- in this case it is cities, but it could be topics or modules.

Resources: Prototypingforlearning.com

mobileappsforlearning.com 12 apps for your phone- to create content, breainstorm and even generate stuff.

Book: Don’t Make me Think: Steve Krug Creating intuitive navigation and information design.

Slideology, Resonate, Presentation Zen, Garr Reynolds

Chrome browser: view, developer, developer tools, it will show you the code in CSS, and you can pick to simulate different devices so you can see how it will appear for spot-checking. You can select your network speed to replicate speeds for various users in different locations.

Browser Stack.com use to spot check courses on all devices, but $40 a month per user.

ABookApart.com Design,, content strategy for mobile, designing for emotion.

Other Tools:

Linea:

Wink: create, concepts, browse, sketching, passing the iPad back and forth and adding photos.

Explaineverything.com: record, records what you do on the app, and has a built in mic. That is pretty damn cool. Draw and record audio and screen. Create several slides. Grab photo from library and edit it. Just for a quick little micro learning video. Share, and can save as MPEG4 for captivate, storyline, etc. You can do fine editing in the audio tool. You can use a web-browser course (an LMS) and highlight stuff. Feedback on a course or website. Draw and record. The classic version is $5 works on phone and iPad.

Reflector App, recording device for a tutorial/training

Ipsum generator- cupcake ipsum.com

It doesn’t work! install Jingproject – screen sharing.

Or Snagit

Creating Scripts For Videos

Notes:

How to properly format a script

Videos can be used to change perspective, demonstrate thing, are mobile and re-playable.

 

Each video should have only one objective. If you have multiple learning objectives, you can create several separate videos for a course, but keep videos simple, concise, and clean.

Videos should not waste people’s time. PRACTICE BLUF!!!

Videos should be short and should offer the path of least resistance- make it applicable and effective.

Plan and prepare your video script:

Include the scene: i.e. exterior, times square at night, or person walking along sidewalk looking into window of office building .

micro video on a shoestring

Pacing

– in a micro learning video- how fast your video moves.

  • reduce word count– remove adverbs. read dialogue out loud- record and play it out loud to find more ways to reduce word count. Don’t add details or extraneous information, pull it out and offer it as an exercise .. Get to the point- 20 seconds-  don’t do the “tell them what you will say, say it, then tell them what you said- DONT REPEAT.
  1. Rapidly change the visuals, static photo with slight motion, then another one- the pictures should amplify the words, but keep them engaged.
  2. Show them, don’t tell them.
  3. Reduce word count by editing ruthless (remove adverbs) “He is moving quickly” – just show them
  4. exclude the nitty gritty details
  5. don’t repeat yourself (did I just say that?)

Characteristics of a well written script

A person says “Hello, and welcome” instead of a 20 second intro.

Develop a character, but still be clear and succinct- get to the point. But there was no point in the first 45 seconds of the video. Re-write: *Actor is getting coffee from machine and fumbling with papers- Man startles her* three lines to setup the problem.

Make sure it is visual! Don’t discuss policy and procedures, instead “click link below to documents”. no point in talking about it.

Edit Ruthlessly

Be succinct, clear and concise.

take advantage of the format

Increase engagement through conflict and contrast:

Write the script with conflict  (argument, different viewpoints, two different points of view-busy guy and chatty guy.) Use several camera angles. – don’t fail to give the person character- she looks busy, give her attitude- looks disgusted and rolled her eyes when he came up to talk. ADD DEPTH OF CHARACTER.

  • Misdirection is used in film all of the time. internal conflict on the same team. A well-written screenplay has conflict and misdirection in every line. NO- I haven’t finished my compliance training! She fidgets and shuffles paper and is irritated “not now, I have deadline”
  • “when will you do it?
  • ”when will there be more hours in the day?”

Screenwriters will develop a full character profile often based on interesting people that they know. Maybe don’t go that far for a 3 minute video. But Screenwriting is a craft.

Videos are timestamped. Have the ability to go back and edit the video. Make it last longer so you can avoid doing that- Don’t put anything date sensitive in the audio or video track. No references to movies, recent news, etc. not spoken date “end of the year” Season, weather, titles, organizational positions and names, technology.

Script writing – get good at writing them and editing them. Plan on paper first. Edit the circle- create narration to meet the needs of the script, never the other way around- you don’t want any dead air. Get an external hard drive. Back everything up. NEVER DELETE THE VIDEO

slides are on the app!

Learning Solutions Conference 2017

I was fortunate enough to attend the eLearning Guild Learning Solutions conference in Orlando this spring. Beyond the networking and mind-blowing demonstrations, we had wonderful weather to compliment the amazing presentations from several experts, in the field. Although I was not able to capture everything, I certainly tried to jot down as much as I could from the sessions that I was able to attend. I have compiled my notes on the various sessions below:

Creating Scripts for Videos: Tom Spiglanin

Resources: http://www.Tom.spiglanin.com

Considering Freelancing:

How Stories Enhance Learning: Katie Stroud

Prototyping and Design Experiences: Nick Floro

MicroLearning