Pro Yearly is on sale from $80 to $50! »

How to be Awesome with Emerging Technologies [SUNYCUAD]

How to be Awesome with Emerging Technologies [SUNYCUAD]

Demonstrate ways to curate content, present information, collaborate with coworkers, and make things interesting using mad skills and disruptive technologies.

Slidedeck from SUNYCUAD in Lake Placid, NY, June 2014. Includes speaker notes with links to all technologies listed.

3ffe1ea88e9bd47aa1613972c06475b2?s=128

Robin Smail

June 04, 2014
Tweet

Transcript

  1. HOW TO BE EMERGING TECHNOLOGY AWESOME RENEGADE ELEMENT ROBIN SMAIL

    SUNYCUAD L AKE PL ACID, NY JUNE 2014 WITH
  2. • OUTSPOKEN • USER EXPERIENCE • GENERALIST • BROWNCOAT

  3. WEB PROFESSIONALS ARE A 
 SWISS ARMY KNIFE — AMANDA

    COSTELLO 
 @AMANDAESQUE
  4. the challenge Demonstrate ways to curate content, present information, collaborate

    with coworkers, and make things interesting using mad skills and disruptive technologies.! Go!
  5. teh twitters

  6. twitter analytics Twitter offers analytics on followers and timeline activity

    for your account, without having to sign up for advertising.! ! http://ads.twitter.com/login
  7. twitter analytics Additional mentions, follows, unfollows and popular tweet information.

  8. twitter archive How do I request my twitter archive? via

    your Twitter settings page.! ! https://twitter.com/settings/account
  9. my mashup geek crush Martin is a technologist from Scotland

    who is interested in EdTech, mashups, google apps script, datamining/wrangling… He’s done all the work to create a live twitter archive so you don’t have to; this is the basic link to all his google apps script work.! ! http://mashe.hawksey.info/category/google/google-apps-script/
  10. twitter archive via gDrive Martin Hawksey how to: http://mashe.hawksey.info/2013/01/sync-twitter-archive-with-google-drive/ Synch

    and host your Twitter archive on Google Drive using Google Apps script. Accesses the Twitter API and auto update your twitter archive in a Google Spreadsheet. Store/host it on Google Drive for public access.! blogpost (start here): http://mashe.hawksey.info/2013/01/sync-twitter-archive-with-google-drive/
 google spreadsheet (make copy): https://docs.google.com/spreadsheet/ccc? key=0AqGkLMU9sHmLdHRtbUF4OGh6ZnBZeFVsSjNhZlc1Z2c#gid=1
 how to video (watch this): http://www.youtube.com/watch?v=ce8G3sEOjAY
  11. mooc archive via gDrive Example of MOOC (massive open online

    course) archiving demonstrates each student’s participation, class activity, and levels of interaction.!
  12. event archive via gDrive Example of event archiving using Hawksey’s

    basic script for an event’s twitter account..
  13. twylah Twitter aggregator breaks down your twitterstream into relevant topics;

    can curate topics and make them sticky. Can also be used for events. ! ! http://www.twylah.com/
 Example (mine): http://www.twylah.com/robin2go
  14. twylah Twitter aggregator example, expanded.! ! http://www.twylah.com/
 Example (mine): http://www.twylah.com/robin2go

  15. snap bird Use Snap Bird to search beyond Twitter’s 7

    day history.! ! http://snapbird.org/!
  16. buffer Buffer allows scheduling tweets for delivery, as well as

    making it easy to share what you’re reading and connect to many of your applications, leveraging your social media presence.! ! http://bufferapp.com/!
  17. content curation

  18. epilogger A real time event archiving application, aggregating tweets, blog

    posts, media, geo-checkins, links, and stats.! ! http://epilogger.com/! !
  19. eventifier Archive all your event photos, videos, slides, tweets, convos

    and much more, using event hashtag.! ! http://eventifier.com/
  20. tagboard Live collections of social media posted with hashtags, arranged

    in a dynamic, visual mosaic. Can get a customizable hub that matches your brand.! ! https://tagboard.com/
  21. storify Make the web tell a story. Collect media; publish

    on Storify; embed anywhere; share and notify sources; go viral. BAM!! ! http://storify.com/!
  22. digital hoarding

  23. instapaper Web based, with mobile apps that save web pages

    and news for offline reading.! ! http://www.instapaper.com/!
  24. pocket Another tool for offline access of web pages and

    news; pocket is more graphically based option. Also both web based and with mobile access.! ! http://getpocket.com/!
  25. evernote Capture ideas, images, notes; access anywhere; find things fast.

    OCR scans of images too. Freaking awesome!! ! (app, mobile app) http://evernote.com/
  26. ifttt A service that lets you create powerful connections (recipes)

    between applications (channels) with one simple “if this, then that” statement. Get as simple or as complex as you need or want. HOLY FREAKING AMAZING.! ! http://ifttt.com/
  27. gimme bar Gimme bar allows you to store items in

    a personal library in the cloud, organize it, and share it with the world. Can also view other user’s public libraries.! ! https://gimmebar.com/! my gifs gimmebar: https://gimmebar.com/loves/robin2go
  28. snapguide Make and share how to guides for just about

    anything. Available on iPad, phone.! ! http://snapguide.com/!
  29. webpage screenshot Google Chrome extension. Looks cheesy as hell, but

    worth it’s weight in gold to capture entire web pages or webcams.! ! http://www.webpagescreenshot.info/! !
  30. keepvid Download and save videos from the web (remember to

    use your technology for good, not evil </PSA disclaimer>).! ! http://keepvid.com/
  31. dropbox Extra space in the cloud; share large files with

    others. (Apps for iPhone, iPad, Android, Blackberry)! ! http://www.dropbox.com/!
  32. cheatsheet A mac-based app that lists all active short cuts

    of the current application you are working in. Simple as that.! ! http://www.grandtotal.biz/CheatSheet/
  33. design

  34. gridfox A grid layout Firefox extension which overlays a grid

    on any website (works especially well with Firebug plugin to create gridfox + firebug aligned sites)! ! http://www.puidokas.com/portfolio/gridfox/
  35. firebug A web development Firefox extension, allows you to inspect

    and edit html, tweak css, debug JavaScript, find errors, view and manage cookies, and more. (works especially well with GridFox.)! ! http://getfirebug.com/
  36. gliffy Web-based diagram editor, allows you to create and share

    flowcharts, network diagrams, user interface designs, tech drawings online. ! ! http://www.gliffy.com/
  37. adobe kuler Create and share color themes, edit color themes

    created by others, collaborate with the community. Explore by newest, most popular, highest rated.! ! http://kuler.adobe.com/! tutorial: https://kuler.adobe.com/links/tutorial/
  38. colour lovers Open community for creating color trends, palettes, and

    patterns for designers to explore.! ! http://www.colourlovers.com/
  39. placekitten Allows you to specify image height and width to

    get perfectly sized placeholder images...of kittens!! ! http://placekitten.com/
  40. placezombies When kittens won’t do. Allows you to specify image

    height and width to get perfectly sized placeholder images...of zombies!! ! http://placezombies.com/
  41. bacon ipsum Bacon ipsum: a meatier lorem ipsum for placeholder

    text! ! http://baconipsum.com/
  42. pixlr Free online photo editor allows you to edit, adjust,

    and filter images; also available as mobile app ! http://pixlr.com/
  43. social media image maker Great tool to resize and retouch

    your social media images.! ! http://www.autreplanete.com/ap-social-media-image-maker/!
  44. typography

  45. what the font Matches your image of an unknown font

    against a font database — or connect with other font-o-philes in the forums.! ! http://www.myfonts.com/WhatTheFont/!
  46. identifont Massive directory of fonts, searchable by multiple options --

    appearance, name, similarity, picture, designer, or fontsets.! ! http://www.identifont.com/
  47. font squirrel Fonts that are 100% free for commercial use.

    Our “go to” site for fonts.! ! http://www.fontsquirrel.com/
  48. font combos common font pairings — pdf, iphone app! !

    iphone app: http://bonfx.com/font-combinations-app/
 blog post: http://bonfx.com/19-top-fonts-in-19-top-combinations/! 19 Top Font Combos pdf: http://bonfx.com/wp-content/uploads/2009/09/19-top-fonts-in-19-top-combinations-chart.pdf
  49. typetester An online application for comparison of fonts for the

    screen.! ! http://www.typetester.org/!
  50. developers

  51. MQtest.io A site that displays which media queries your current

    browser supports.! ! http://mqtest.io.net/
  52. screensiz.es An extensive database of screen sizes for popular smartphones,

    tables and monitors currently available; useful for web developers designing responsive apps to work across various screensizes. ! ! http://screensiz.es!
  53. ami.responsivedesign.is See how your site looks on multiple common screen

    sizes. This 4-in-1 viewport tool shows how your site looks on desktop, laptop, iPad & iPhones.! ! http://ami.responsivedesign.is/
  54. brad frost’s ish. 2.0 ish. — yet another viewport resizing

    tool; focuses on general ranges (small-ish. medium-ish. large-ish.), rather than popular device widths. “Disco Mode” randomly contorts the viewport to all sorts of random values, which is important to test the resiliency of your designs.! ! http://bradfrostweb.com/demo/ish/!
  55. code anywhere A free browser-based code editor with an integrated

    ftp client and syntax highlighting, supporting html, php, JavaScript, css, xml.! ! https://codeanywhere.net/
  56. css desk Online html/css sandbox. Experiment, see the results live,

    and share code with others.! ! http://cssdesk.com/
  57. chop app Collaborative space to post code, write notes, share

    feedback. A little app that lets people slice up bad code and share their feedback to help put it back together.! ! http://chopapp.com/
  58. accessibility

  59. wave toolbar Web Accessibility Evaluation Tool — free web accessibility

    evaluation tool shows the original web page with embedded icons and indicators that reveal the accessibility of the page. Use on URL, file upload, or straight HTML code.! ! wave.webaim.org/toolbar
  60. jim thatcher’s favelets Allows spot checking for skip navigation, headers,

    images and more.! ! jimthatcher.com/favelets/!
  61. web developer Extension adds various web developer tools to a

    browser; available for Chrome, Firefox and Opera, and will run on any platform that these browsers support including Windows, OS X and Linux. http://chrispederick.com/work/web-developer/! ! https://addons.mozilla.org/en-US/firefox/addon/web-developer/
  62. juicy studio toolbar A toolbar Firefox add-on from Gez Lemon,

    shows ARIA live regions, ARIA landmarks and roles, provides a table inspector and a color contrast analyzer.! ! https://addons.mozilla.org/en-US/firefox/addon/juicy-studio-accessibility-too/
  63. process

  64. styletil.es More than a mood board, less than a full

    mockup. Style Tiles are a design deliverable consisting of fonts, colors and interface elements that communicate the essence of a visual brand for the web so you can develop design instead of fixed width.! ! http://styletil.es/!
  65. trello Web-based project management application that makes it easy for

    groups to see work in progress, empower them to self assign project work and get things done by dragging cards across lists to completion. Uses kanban paradigm for managing projects.! ! http://trello.com/! !
  66. idonethis An email-based productivity log that motivates and tracks productivity

    with a daily email reminder.! ! http://idonethis.com/!
  67. project of how An open interactive library of techniques and

    insights, that makes your creative output better.! ! http://projectofhow.com/
  68. critical knowledge

  69. social media policy Don’t lie. Don’t pry. Don’t cheat. Can’t

    delete. Don’t steal. Don’t reveal. Farris Timimi, M.D., medical director for the Mayo Clinic Center for Social Media. Best policy ever, boiled down to twelve words. ! ! source: http://socialmedia.mayoclinic.org/2012/04/05/a-twelve-word-social-media-policy/! slideshare: http://www.slideshare.net/practicalwisdom/12-word-social-media-policy!
  70. BE AWESOME. RENEGADE ELEMENT ROBIN SMAIL @ROBIN2GO ROBIN2GO.NET ROBIN2GO@GMAIL.COM ABOUT.ME/ROBIN2GO