Class Tuesday, May 21, 2013
Today we will begin creating a mobile website and app in Dreamweaver CS6.
You will work with a partner on this project. You can choose your partner this time.
1. I will give you an overview of what you are doing.
2. Choose a partner and sit together with one of the computers that has Dreamweaver (I will show you).
3. Follow along with me as I guide you in opening Dreamweaver and starting a new mobile site. We are also going to create a custom JQuery mobile theme using http://jquerymobile.com/themeroller/.
4. Plan the content for your mobile site. You will see the template you have is very basic. You are going to edit the template and add your own content. You can do a mobile site for the school, the city, a business, a band, a famous person, a sports team, a college, etc. Let me know what you want to do.
Your mobile site has five pages- a home page, and four sub-pages. Plan your content with this in mind. Each page should have something, text, a link. Keep it simple.
Each page has a header, body area, and footer. Again, plan your content with this in mind. You will be expected to utilize each of these areas.
5. Once you have completed your site, I will show you how to compile it as an app using Adobe PhoneGap Build, and how to download it and test it on an Android device.
Congratulations! You have developed your first app!
Class Wednesday, May 15, 2013
Preparing for mobile app development
We are going to use Dreamweaver CS6 and App Inventor to create mobile apps.
Before we do that, we are going to look at some resources for app development.
1. Where to begin?
We looked at two useful app prototyping tools on Friday:
https://www.fluidui.com/- Open in Chrome
Also, here are some useful app tutorials to help get the creative juices flowing.
2. Android vs iOS (Apple)
Curiosity- check out cell/wireless coverage in area and top carriers
3. Dreamweaver CS6
Here is a video overview of creating and packaging an app with Dreamweaver CS6.
How can you get Dreamweaver or any other Adobe product you like? Every Adobe product is available to download for free to try for one month. Students and teachers also receive a significant discount to purchase the software and/or to subscribe to Creative Cloud. We’ll talk more about this today.
4. Let’s look at App Inventor
5. Pick one of the above app prototyping tools from #1 and start creating a rough draft for an app. It can be anything you want!
Class Tuesday, May 14, 2013
1. Finish your “Thinglink.” Let me know when you’re done so I can add you to the following:
2. Go to Google.com and click Images to do an Image Search. Type Atari Breakout into the search box. You’re welcome.
3. These three tests will give you some insight into how user-friendly (or not) a site is. Click the links to take each short test. Then click “do a test now” from the right-hand side of the page.
- Five Second Test
- Nav Flow
- Click Test
4. I will come around and install Dreamweaver on your computers today.
Class Monday, May 13, 2013
1. I will be coming around to install Dreamweaver on some of the computers in advance of your next project.
1a. What the heck is going on?
2. You are going to work on a small project today and tomorrow while we have students taking the MCAS exam.
You will work with Thinglink to embed content in an image.
Here is an example I created this morning.
First, click Join Now from the top right. You can choose to log in with Facebook or Twitter or just register for a new, free account with your email address and a password.
You are now signed up! Time to find an image and plan your “Thinglink.”
A. Find an image. Suggestions: you and your family and/or friends, a city, a country, a band, a TV show, a movie, a person you admire, a historical figure, etc.
B. Think about other content to link in this photo- videos, other images, websites, audio, text. Keep all of this together and available so you have it ready when you begin to add the content to your image.
C. Once you have done that, click Create on the top right and starting creating your Thinglink.
D. To add content, just click anywhere on your photo once it is uploaded. You can then either add text or a link to another website, an image, an audio file, etc.
E. Let me know when you are done so I can grab the code or link to share on our class page.