Showing posts with label programming. Show all posts
Showing posts with label programming. Show all posts

Saturday, April 2, 2016

Create A 2D Game - Part 4: Programming


This is the fourth section of five on how to design and create a 2d game. Before reading this article you should ideally have read the 2D Game Concept, 2D Game Structure and 2D Game Graphics & Audio sections.

2D Game Programming

Programmers work at the heart of the game development process. They design and write the computer code that runs and controls the game, incorporating and adapting any ready-made code libraries and writing custom code as needed. They test the code and fix bugs, and they also develop customised tools for use by other members of the development team. Different platforms (games consoles, PCs, handhelds, mobiles, etc.) have particular programming requirements and there are also various specialisms within programming, such as physics programming, AI (artificial intelligence), 3D engine development, interface and control systems.

As mentioned in the earlier sections we are recommending you use Scratch to create your first 2D game. So in this section we will focus on the Scratch programming method and show you how to create your 2D game using their programming 'blocks'.

2d game programming with Scratch
A sample snippet of scratch code with annotated explanation

These drag and drop programming 'blocks' are colour keyed and split into easy to understand sections.

colour coded 2d game programming with Scratch
The colour coded sections make the programming easier

The scratch website can host your games and embed them into a website so that people can play them online, share them on Facebook or download them to be played on their own computers. Below is a selection of scratch resources, which I have either created or selected for you, including scratch programming demos, game templates and sample games.

You can use these resources to start creating your own games and/or animations. You do not need a scratch user account to play theses games and demos but you will need to create a scratch account to start making and remixing games, but don't worry, it's all free. Be sure to follow the onlinedesignteacher Scratch channel to be sure to get our latest releases.

5 Great Scratch Games To Inspire You ...

Sometimes we need a little inspiration to get our creative juices flowing so here are 5 great little 2D games, made using Scratch, to inspire you to get started.


2D Game Templates To Practice On ...

Even with our game graphics and audio already made in the previous section you should not jump straight into programming your own game without doing a little practice first. These are game templates which you can 'remix' into your own versions of them. This is a great way to get started with 2D game creation and programming and there is already a structure in place to help you. In order to understand the very basics which will allow you to do this then watch this short video.
  • Pong Game Template - the first game ever ready for you to re-invent it.
  • Top Down Game Template - the top down view is a clasic 2D game view, what can you create with it.
  • Shooter Game Template - shooter games were huge in the early years of gaming, have a go yourself and see why.
  • FPS Game Template - another shooter game template! just to give you some variety and options to play around with and practice on.
  • Sniper Game Template - this game template features a XY scrolling sniper view which you can edit and expand into a full 2D game.
  • Side Scrolling Platformer Template - side scrolling platformers like Mario and Sonic are game that we are all fmailiar with and now you can make your own using this template.
  • Catch/ Collect Game Template - ideal for a simple mobile style game, this template uses the Scratch 'cloning' feature to create multiple objects from the same game sprite.
  • Paint Programme Template - while not exactly a game template this paint program showcases more of the features of Scratch that you can utilise in your own 2D game.

Getting Started With Scratch... 

Scratch 2d game engine interface
The different sections of the Scratch User Interface are designed to give you the full range of tools to create your 2D game

The 2D game resources below are a must to help you get started with your own 2D games after you have practiced on the 2D game templates above.

2D Game Features To Use In Your Own Game...

These features are all very basic with simple place-holder graphics so just focus on the programming code and notes and take the bits you need for your own 2D games. You can copy programming code blocks or game sprites using the 'backpack' feature at the bottom of the game editor interface.
  • Game Timer - especially useful for racing games but can also be used to time your 2D game player when completing tasks or levels as well as for ranking players in the leader-board.
  • Ammo Counter - a must for any shooter or FPS game in which ammo is a key variable but can also be used in adventure or platformer games too.
  • Shooting & Scoring - these usually go hand in hand in 2D games so we decided to put them together in this demo which you can use to create your own 2D game scoring and/or shooting features.
  • Player Health Bar - a players health is a key variable in fighter games but health or lives are also an industry standard in most 2D games.
  • 2D Game User Interface - this template includes a score counter, ammo counter, timer and sniper sight and is ideal for shooter games but can be tweaked to suit any type of 2D game.
  • Game Menu  - before we begin any 2D game we first pass through the game menu so we have provided you with a ready made menu to get you started.

Next Up...

Once you have completed the programming stage of the 2D game you should move onto the final step which is the testing of your 2D Game.

Monday, March 14, 2016

Introduction To HTML

An introduction to HTML5
What is HTML? Who invented it? What is it used for? How can I learn it? 

Who Invented HTML?

HTML was invented in 1990 by a scientist called Tim Berners-Lee. HTML is an abbreviation of 'HyperText Mark-up Language' although that probably doesn't help you much so let's explain that a little more.
  • Hyper is the opposite of linear. Computer programs used to run linearly, i.e. when the program had executed one action it went to the next line and after that, the next line and so on. But HTML is different - you can go wherever you want and whenever you want. 
  • Text is text, that's self-explanatory
  • Mark-up is what you do with the text, similar to formatting. You are marking up the text the same way you do in a text editing program with headings, bullets and bold text and so on.  
  • Language is what HTML is. It is a computer language but written using many English words or abbreviations of English words. 

What is HTML Used For?

The purpose was to make it easier for scientists at different universities to gain access to each other's research documents. By inventing HTML he laid the foundation for the web as we know it today. HTML is a language, which makes it possible to present information on the Internet. What you see when you view a page on the Internet is your browser's interpretation of HTML. To the untrained eye, HTML code looks complicated but this tutorial will help you make sense of it all.

If you want to make websites, there is no way around HTML. Even if you're using a program to create websites, such as Dreamweaver, a basic knowledge of HTML can make life a lot simpler and your website a lot better. The good news is that HTML is easy to learn and you can even use any basic text editor, such as 'Notepad', 'Simple text' or 'Pico' to write your HTML and save it as a web page by giving it the .html file extension. You can then open it in any browser to see as a web page. It is not important which browser you use. The most common is Microsoft Internet Explorer. But there are others such as Chrome, Opera and Mozilla Firefox and Safari.

How Can You Code HTML?

HTML is mainly English words, as already mentioned, but these words need to be 'Marked Up' or 'Tagged'. The way in which they are tagged and the order in which they are marked up needs to follow particular rules. Here are a few basic rules...

  • HTML tags are keywords (tag names) surrounded by angle brackets:
  • HTML tags normally come in pairs like <p> and </p>
  • The first tag in a pair is the start tag, the second tag is the end tag
  • The end tag is written like the start tag, but with a slash before the tag name

Basic text editors such as Notepad are excellent for coding HTML because they do not interfere with what you are typing by highlighting what it perceives as errors. It gives you complete control. The problem with many of the programs that claim they can create websites is that they have a lot of standard functions, which you can choose from. The downside is that, everything needs to fit into these standard functions. Therefore, these types of programs often cannot create a website exactly as you want it or, even more annoyingly; they make changes to your hand-written code.

With Notepad or other simple text editors, you only have yourself to thank for your successes and errors although they can be difficult to use when you have a lot of code and don't offer any features or functions to make your coding life any easier. A happy medium between the likes of Dreamweaver and Notepad are FREE programs like Context and Komodo Edit which describe themselves as small, fast and powerful freeware text editors. However, whatever program you decide to use HTML will still be the cornerstone of creating your website. Although this series of notes is focussed on HTML programming it is also important to mention that the overall aim is to create a website and that the web design process should also be something you learn and utilise.

What Next?

Now that you have an understanding of what HTML is all about why not continue reading and learn how to make your own websites using HTML. A HTML website must follow a structure or template so that it  is 'read' correctly by the browser. Let's look at that structure now.


close
Banner iklan disini