Introduction to Mobile apps for the Non-Programmer. Elizabeth Jean Brumfield, MLIS, CAS, ABD

Transcription

1 Introduction to Mobile apps for the Non-Programmer Elizabeth Jean Brumfield, MLIS, CAS, ABD

2 Why Apps Why Now Why Libraries Mobile apps are now used more than desktops, they have a great impact on education because students are connected to systems and information more. Librarians are interested in providing information, in all forms. Librarians are there to make your life easier. Most universities have mobile apps which may include the library but not library functions. /2010/09/library-mobile-apps-vs-web-appssome.html#.VNYsqE90xdg

3 Interest Level 1. Curious about the topic 2. More than curious, want to learn basics 3. Want to learn basics and experiment with creating an easy project 4. Very interested but don t want to invest a huge amount of time in a project 5. Willing to invest whatever time is necessary to learn everything and create 1 or more projects

4 Agenda Part 1. Basics Definitions, Comparisons Part 2. Creating Your Own App (Guidelines) Part 3. Create Your Own App Part 4. Using HTML 5 Objective Provide an introduction to mobile apps Provide examples Participants will start their own mobile app Participants will leave motivated to explore more mobile app development options

5 Perceptions and challenges Mobile requires a certain directed approach that is not required with desktop application development. Purpose Designing mobile apps require a different thinking than designing websites. Design Mobile users still expect everything to work flawlessly on whatever random device they may be using. This perspective is flawed. People Mobile app require an awareness of the technical opportunities and challenges. Designing good educational applications requires collaboration between educators and tech professionals. Systems/Technical requirements Knowledge of how people learn (key components include interaction and feedback). People

6 Definitions Webpage Hypertext document desktop viewing Mobile app software application--small, wireless computing devices, such as smartphones and tablets, rather than desktop or laptop computers. Mobile web or Mobile web app website created specifically for mobile devices accessible through mobile browsers, no download or installation required, term mobile app sometimes used interchangeably--the url is an indication it is a mobile web app as well as the markup language source code. Native app An executable program coded in the machine language of the hardware platform it is running in. A native application has been compiled into the machine language of that CPU (central processing unit brains of the computer). Template app Pre-fabricated templates or shells (commonly outsourced from Indian and other overseas template builders) as the basic structure on top of which to import and cut and paste designs.

7 Native App-Programming Programming: Android applications are written in the Java programming language IOS in Apple Objective-C Blackberry Java Windows C#, Basic 4ppc Web codes can also be incorporated

8 Mobile Web App-- Markup Languages (language of the web): HTML (1-5), XML, XHTML, A markup language is a language that annotates text so that the computer can manipulate the text

9 Bottom Line! To develop a native app you need to know programming (Java, etc) and should know markup languages (HTML, XHTML-MP, etc.) Web apps require knowledge of markup languages (even if just the basic HTML) Both Native apps and Web apps require a substantial amount of time investment in the development Native apps require a financial investment getting into the marketplace

10 Template App-- Pre-programmed No programming experienced needed No knowledge of HTML needed

11 Mobile App Mobile Web App Template App

12 Questions What Kind of Project Do You Want to Do? 1. What do you want your app to do? 2. How much time do you want to spend creating it? 3. Do you want it to be used publicly or for your own purposes? 4. What type of financial investment are you willing to make?

13 Example: Mobile app (IOS) also available Android Native mobile app & web app

14 Mobile web (app)

15 Example Mobile web template app

16 PVAMU Homecoming App Template App

17 Part 2 Creating Your Own App Designing

18 Creating your mobile app General Guidelines (PTSD) Purpose/People Travel/Mobility Systems/Technical requirements Design (pictures, colors, text, pages)

19 Simplicity Aesthetic yet practical Small screen-no room for overblown design elements, navigation, text Bandwidth-some pay by the minute-reduction in heavy elements like pictures, videos, audio Information-fast-utilitarian not always entertainment

20 Design ADA Compliant Mobile Apps must comply with same ADA laws as websites: Twenty- First Century Communications and Video Accessibility Act (CVAA), Section 508, or the Americans with Disabilities Act (ADA) Example: Text, Sound, Color Deuteranope (Deutan)--a form of red/green color deficit Protanope (Protan)--another form of red/green color deficit Tritanope (Tritan)--a blue/yellow deficit- very rare

21 Colorblind Scale

22 Test your app colors Websites: Test your mobile app for ADA

23 Part 3 Creating Your App Template App

24

25 Part 4 Using HTML5 Creating Web Apps (To be continued)

26 Developing Web Apps with HTML (for iphones) Draft a concept of what you want it to include and look like Learn the language(s), HTML, Java script, CSS, WCSS Get a text editor Install a simulator Register as a developer (IOS Dev Center) Pay Developer fees and apply to Apple for registration of your app Market your app

27 Learning the Language A markup language is a language that annotates text so that the computer can manipulate the text. Most markup languages are human readable because the annotations are written in a way to distinguish them from the text. For example, with HTML, XML, and XHTML, the markup tags are < and >. Any text that appears within one of those characters is considered part of the markup language and not part of the annotated text.

28 Example

29 Put it all together HTML Example My App This is what HTML looks like!

30 Quiz 1. What makes an app native? 2. What are the principles of app design? 3. What is one difference between template apps and native apps? 4. <!DOCTYPE html> indicates what? 5. CSS allows you to do what?

31 Thank You Elizabeth Jean Brumfield Prairie View A&M University NWHC 9449 Grant Road Houston, TX