Showing posts with label Web Design. Show all posts
Showing posts with label Web Design. Show all posts

Sunday, January 29, 2012

Getting Started Coding with HTML

Html files are just normal text files with the extension .htm, .html, or .shtml.  You can think of html as learning how to "talk" to the computer in its language, so it will display what you want.  We will be using Text Wrangler in our class to create the html files.  Let's take a look below at basic html:


<html>
<head>
<title>The title of your webpage goes here</title>
</head>
<body>The body text goes here.  These are the words that appear on your webpage.</body>
</html>

You will begin the document by typing <html>.  This communicates "Attention Computer, I am speaking html to you." You always end the document by communicating "Attention Computer, I have completed talking to you in html."  This is done using </html>.  Numerous html code components are open and shut in the same manner.

A great place to get started learning code is online such as W3Schools and Lisa Explains It.  Once you have a basic understanding of code, you can simply test it out online such as with the Tryit Editor on W3.

Of course the Internet is always changing and the new web standard is actually HTML5.  Don't worry this won't involve too much of a transition.  In fact, You can quickly see the new (and eliminated) code using an HTML5 Tag Reference sheet.

What are some of your favorite html/html5 codes you have tried?

Sunday, January 8, 2012

Web Design and Web 2.0

  When you think back to a time without the Internet, it is sometimes hard to remember for some and for others the Internet has always been here.  Have you ever wondered what was the first communication between computers?  lo.  Yes, "lo" was the first transmission in October 1969!  The actual word was "login" but the system crashed after the first two letters were transmitted.  Sometimes a crashing failure is just the beginning of a whole new world!

Being an 80's teen, I can definately remember life without the Internet especially as mainstream as it is now-a-days.  Can you believe that only 1% of information flowing through two way communication in 1993 was from the Internet?  By 2000 this had increased to 51% which was right before the term "web 2.0" was coined by Tim O'Reilly in 2004.  This marked the beginning of a dramatic shift in the Internet.  By 2007 this number was increased to 97%.  Wow, what a difference!

This shift from a read only web, Web 1.0, to a read write web, Web 2.0, has made a dramatic impact on web design.  In the past, the ability to design websites was limited to those with the ability to code using language such as html.  When the shift of the Internet first started, software was being produced to allow people to create websites with no code experience.  People with experience in common software such as PowerPoint could have a website.  Other software such as FrontPage and Dreamweaver was produced for even more control over the design elements.

This Techie Tiders website is a great example of how the shift of the Internet has opened the world of web design to anyone.  Using blogs, wikis, and numerous other online tools allow even people with just basic computer knowledge to have a presence on the web.  Even social networks such as Facebook are being used for websites. 

How else has this Internet shift helped web design?  Just a few years back you would need to purchase software to create dynamic text, edit photos, and so on.  Now you have numerous sites from which to choose.  A great example of this is Photoshop software. There are dozens of site that now allow you to edit photos or create your own images such as Pixlr. There are tons of other examples.  What other ways has Web 2.0 had an effect on web design?

Tuesday, January 3, 2012

Welcome to Web Design!

Are you excited about getting started on the new semester?  Have you ever felt "out of the loop" with technology?  Ok maybe not as "out of the loop" as the walkman man! LOL

While we discover the world of web design, you will be immersed in everything geeky.  Ok, not everything, but you will discover a world of possibilities outside of Facebook and gaming.

Have you heard of the 365 day project?  Basically it is a project where you document your year through daily pictures.  Numerous sites even have easy ways to post such as Flickr, and others have themes to help you come up with ideas.  Some people have taken the idea and added their own twist, such as Paula Naugle.  She is posting a picture of one tweet from the day that helped her learn and connect with others.

We are going to have our own twist to this project.  You will be in this class for 44 days, so we will run a 44 day techie project.  Each day you will write a blog post including a picture of the day.  This picture will be of something techie from a screen shot of a awesome site to a graphic you have created.  These blog posts can be in our online classroom or you can choose your own platform such as Posterous or Blogger.

I'm looking forward to seeing things through your eyes:)

Thursday, December 11, 2008

Student Show and Tell

Today was Show and Tell for Web Design students.  I only have one word for it, AWESOME!  I can't believe how far they have come in such a short time:)

We are working on a Game Programming unit using Alice.  This unit will be moved to the multimedia class in the future, but for this semester I was testing it out with my web design students.  Each student was required to show the current Alice world they are working on.  Then they demonstrated a "how to" on something they included in their world.

It was great to see so many of the same functions/events configured in different ways and thus producing a different end result.  Most of the student already have the inactive component incorporated in their world.  All of the Show and Tells gave students ideas.

Way to GO!

Hey, someone needs to add an Alice page to our wiki.  That would be a great place to collaborate information.  I sure wish you all could stay for next semester:)

Thursday, December 4, 2008

Stressed?

Well, some of you were starting to get pretty stressed on Alice today, but we had a lot of laughs with all your "learning" experiences.  I thought you might like a break during Friday's lesson:)  Of course I have to relate it to our unit, but....

My first attempt at game programming was when my brother and I created pong for our family computer. No, I wasnt a geek...we were copying it out of a book and then changed a few things to change colors and such.  Ok so we didnt have cable.  Anyway, I found a GREAT widget for you:)  

When you start feeling  aUGHHH... play a game of pong.  If it doesnt show up below then it is Smartfiltered:(

Get the Flash Pong widget and many other great free widgets at Widgetbox!

Thursday, November 27, 2008

Unit 6 Game Programing~WD

Welcome to the world of game programming!  Of course you will find your daily directions on the lesson page, but this post will give you an introduction to the unit.  Each day will also have various demos according to the lesson.  The game programming unit takes you behind the doors of creating games and even give you hands-on practice as a graphic programmer who developes and modifies complex 3D graphic renderings.   I'm sure some of you are already thinking about what sprites you want to make and game ideas. Other's of you are in a panic thinking you only have a few weeks to learn a new programming language. This unit is just an introduction to game programming for which we will use the Alice program.   By using Alice, the first several steps of a graphics programmer has already been completed. These steps required a good grasp of math concepts such as vector and matrix math, quaternions and linear algebra.   These math concepts are really just an extension of what you are currently learning right here at MHS:)   You will be surprised at how much you will learn in just a few weeks!  



Step One: Research

Of course, we will start this unit like all others with...RESEARCH. You already know that during this unit you will primarily play some of the roles of a graphic programmer, but there are more roles behind the gaming industry.

Your first project is to create a Chat About It while researching game programming.  Check out the Mrs. D's File Cabinet for your project guidelines.

Get started researching!  As you do, make sure and add to our Game Programming wiki  on Tiderwiki.  As you find good websites, add them to your Diigo; you will need some good ones for your Chat About It:) Dont limit yourself to our class library collection!  You also have access to the MHS library, parish library, and even online libraries such as IPL.










Jumpstart Research TopicsRandy Pausch Video 
Creator of Alice Software Project 


  • Game Programming

  • Roles in Creating Game Programming

  • Top Names in Gaming Industry

  • Top Gaming Artists

  • Alice Software

  • 3D Vectors

  • Math Behind Game Programming


 

Step Two:  Organize

Ok this is probably your least favorite section of every unit.  Yet every unit requires some form of organization.  I have some good news, the "true" organization involved in Game Programming has already been completed for you.  I would like you to know about the organizational structure, documentation and code architecture, involved.  Once you are in the Alice program you will be able to see some of this organization.  You will need your storyboard for the planning stage, because this is where you will organize your plan using the software.



  • What is the design document?

  • How does data structure affect the organization of software?


Step Three:  Sneak Peak

Before you can plan your programming, you need to get a taste of the Alice software.  

1)  Download Alice

2)  Drag and Drop Alice in your Applications

3)  Open and Play:)

Don't worry, you aren't going to "mess up" the program.  You are learning through "trial and error."  There are built in tutorials you will find when you open the software.  Remember my first rabbit on Alice was going to move his arm about a meter and instead it detached from his body about a meter.  It reattached without any need for surgery!  From which I learned detail, detail, detail.  I was moving too quick, not using a tutorial, and forgetting detail.  HAVE FUN!


Step Four:  Plan

Ok, take out your storyboard and plan what your character(s) will do.  Don't leave out scene(s).  Remember to think about the detail involved in making these actions.  Do you want to include other student's characters?  

Step Five:  Create

Get busy creating.  As you learn new tricks, make sure and post about it in the discussion board.

Step Six:  Share


Game Programming Forum

[forum:2492]