The Rise of Mobile for Nonprofit Communication & Fundraising

455 views

Published on

From Blackbaud's Higher Ed Forum in Boston, Tom Thayer's presentation cites stats & trends about the growth of mobile devices in our daily lives.

Published in: Internet, Business, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
455
On SlideShare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
5
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

The Rise of Mobile for Nonprofit Communication & Fundraising

  1. 1. Communicating Effectively Across Devices With Responsive Website Design presented  by  Tom  Thayer  
  2. 2. 4/21/14   2   THE RISE OF MOBILE IN HIGHER ED Tom Thayer Interactive Services Principal Experience With Non-Profits: 10+ years Experience in Higher Ed: 2+ years Areas of Expertise: Web Design, Web Development, Content Strategy, Project Management, Content Management Systems, Digital Asset Management, Digital Strategy etc.
  3. 3. 4/21/14   3   WHO IS BLACKBAUD INTERACTIVE? •  Data Geeks •  Designers •  Digital Strategists •  Fundraising Pros •  Information Architects •  Content Experts •  P2P Specialists •  Researchers •  Storytellers •  Marketing Pros •  Web Gurus
  4. 4. 4/21/14   4   OUR COMBINED EXPERIENCE
  5. 5. 4/21/14   5   WHAT’S UP OUR SLEEVES?
  6. 6. 4/21/14   6   WHAT’S UP OUR SLEEVES?
  7. 7. 4/21/14   7   HOW OUR TEAM WORKS DISCOVERY RESEARCH CONTENT STRATEGY ARCHITECTURE DESIGN
  8. 8. 4/21/14   8   TODAY’S DISCUSSION What is Responsive Web Design? Why Everyone Should Be Using RWD How and Why We Should Go Beyond RWD Trends
  9. 9. 4/21/14   9   TODAY’S DISCUSSION What is Responsive Web Design? Why Everyone Should Be Using RWD How and Why We Should Go Beyond RWD Trends
  10. 10. 4/21/14   10   WHAT IS RESPONSIVE WEB DESIGN?        CONTENT <!-- HTML -->        STYLE /* CSS */
  11. 11. 4/21/14   11   WHAT IS RESPONSIVE WEB DESIGN?                CONSTYLEWEBSITES!
  12. 12. 4/21/14   12   css   WHAT IS RESPONSIVE WEB DESIGN? css           SINGLE SOURCE CONTENT
  13. 13. 4/21/14   13   WHAT IS RESPONSIVE WEB DESIGN? BREAKPOINTS 980px+ 768–979px 320–767px
  14. 14. 4/21/14   14   WHAT IS RESPONSIVE WEB DESIGN? Ethan Marcotte
  15. 15. 4/21/14   15   WHAT IS RESPONSIVE WEB DESIGN? BREAKPOINTS 980px+ 768–979px 320–767px %
  16. 16. 4/21/14   16   TODAY’S DISCUSSION What is Responsive Web Design? Why Everyone Should Be Using RWD How and Why We Should Go Beyond RWD Trends
  17. 17. 4/21/14   17   WHY GO RESPONSIVE? Everyone else is doing it…
  18. 18. 4/21/14   18   WHY GO RESPONSIVE? Source:  StatCounter  
  19. 19. 4/21/14   19   WHY GO RESPONSIVE? Source:  StatCounter   61% 9.4% 2012 15.2% 2013
  20. 20. 4/21/14   20   WHY GO RESPONSIVE? Source:  Google   Because Google says so…
  21. 21. 4/21/14   21   WHY GO RESPONSIVE? Our users deserve better!
  22. 22. 4/21/14   22   USER CENTERED DESIGN WANTS NEEDS LIMITATIONS Hi, I’m the user.!
  23. 23. 4/21/14   23   WHAT THE USER WANTS 1.  Clear Messaging 2.  Consistency 3.  Connection 4.  Context 5.  Guidance I want stuff.! ( sort of )*
  24. 24. 4/21/14   24   WHAT THE USER NEEDS 1.  Interactions 2.  Transactions 3.  InformationsI need, therefore I use.!
  25. 25. 4/21/14   25   HOW THE USER IS LIMITED 1.  Distractions 2.  Environment 3.  Input Methods 4.  Disabilities 5.  Time / Patience 6.  Knowledge 7.  Ability 8.  Etc… Help me, help you.!
  26. 26. 4/21/14   26   USER CENTERED DESIGN WANTS NEEDS LIMITATIONS (quality  experience)   (few  and  focused)   (varied,  complicated,  somewhat  predictable)  
  27. 27. 4/21/14   27   USER CENTERED DESIGN WANTS NEEDS LIMITATIONS
  28. 28. 4/21/14   28   HOW RWD GIVES THE USER WHAT THEY WANT A Quality Experience •  Readable Content •  Reformatted Branding •  Mobile Navigation •  Mobile Specific Content
  29. 29. 4/21/14   29   HOW RWD GIVES THE USER WHAT THEY NEED •  Interactions •  Transactions •  Informations Needs: Few and Focused
  30. 30. 4/21/14   30   HOW RWD HANDLES USER LIMITATIONS Varied Limitations •  Remove Distractions •  One-Handed Operations •  Limit Form Fields •  Flat Designs •  Simple Conversion Paths •  Valid Code •  Simple Operations
  31. 31. 4/21/14   31   HOW RWD HANDLES USER LIMITATIONS
  32. 32. 4/21/14   32   TODAY’S DISCUSSION What is Responsive Web Design? Why Everyone Should Be Using RWD How and Why We Should Go Beyond RWD Trends
  33. 33. 4/21/14   33   USER CENTERED DESIGN WANTS NEEDS LIMITATIONS (quality  experience)   (few  and  focused)   (varied,  complicated,  somewhat  predictable)   WE FIGHT FOR THE USER
  34. 34. 4/21/14   34   TODAY’S DISCUSSION What is Responsive Web Design? Why Everyone Should Be Using RWD How and Why We Should Go Beyond RWD Trends
  35. 35. 4/21/14   35   BEYOND RESPONSIVE WEB DESIGN
  36. 36. 4/21/14   36   BEYOND RESPONSIVE WEB DESIGN
  37. 37. 4/21/14   37   BEYOND RESPONSIVE WEB DESIGN Source:  Luke  Wroblewski  
  38. 38. 4/21/14   38   BEYOND RESPONSIVE WEB DESIGN Source:  uxmaDers.com  
  39. 39. 4/21/14   39   BEYOND RESPONSIVE WEB DESIGN Source:  Luke  Wroblewski  
  40. 40. 4/21/14   40   BEYOND RESPONSIVE WEB DESIGN Source:  uxmaDers.com  
  41. 41. 4/21/14   41   BEYOND RESPONSIVE WEB DESIGN Source:  Luke  Wroblewski  
  42. 42. 4/21/14   42   BEYOND RESPONSIVE WEB DESIGN BLACKBAUD’S MOBILE TAPS INITIATIVE 16 MAXIMUM TAPS 49% OF EMAIL IS" READ ON MOBILE

×