log

During this lecture the main focus objective or focus was around creating and looking at how to approach the scope for this site. For this we had a selection of questions that were designed to make us think more about the sites functionality and design rather than its aesthetics. Firstly we reviewed the first sites we had made and discussed any browser or platform issues we had encountered in preparation for making our portfolios. By doing this we would be able to keep in mind any problems and also think about how we could tackle or solve them during the creation of this site. Then we answered the set questions and began creating our sites scopes or specifications. Mine can be seen in the photo opposite. The majority of the scopes focus was on the sites content and how it would work with only a small amount of consideration on how the site would look. This function before form approach was used to help us have a better idea of the sites mechanics when building it so we had a clearer idea of what we were building and why.

After completing a rough scope I then went on to create a basic site structure diagram. This would help me lay out the navigation of the site as I was breaking down the content into the pages on the site. As shown I split the content into 6 primary pages, Home, Log, Mobile Projects, Website Projects, Contact and Hotglue. The home page would serve as the start of the site with basic information on myself and the portfolios purpose. This and other page content was shown on the diagram by adding smaller boxes onto the main pages stating what the page content would be. The first draft of page content can be seen at the bottom of the page in the form of a list. After I had decided on my site structure I then designed a rough sketch of the Homepage taking into account the ideas I had thought of during my scope and also other inspiration (See home page).

06/10/14:MY FIRST PROGRAM

The main focus of today's lecture was to begin using the program Processing and to learn how to code using it. The exercise started with the basic functions of the language for example completing simple maths equations and then moving on to actually drawing shapes within the program. Once the shapes had been created such as rectangles and ellipses we explored further options such as applying colours.By this point in the exercise we had been introduced to the key parts of creating a program for example writing if statements and calling different functions. As the lesson went on we looked at moving and animating the shapes via processing. We then began experimenting with different speeds, colours and shapes. The following photo shows the final code I had produced.

In the lecturer today I progressed with my programming skills and knowledge. I looked at creating things such as loops to repeat actions or events. I first began looking at ideas to create my first programming project on. For this I looked at existing projects on openProcessing.com where other users had uploaded their sketches along with the code. I found this useful as it allowed me to not only see different design ideas but also gave me the option to download code and have a hands on approach/look at how it worked. From this I then created a small program which was supposed to simulate a fish pond. As shown in the following video you can see how the program and code works. Although the program did not come out as I had exactly intended it too, I am still pleased with the result.

20/10/14:MY FIRST PROJECT

20/10/14:MY FIRST PROJECT CONTINUED

Today was the first lesson in which I had to think of and begin working on my own individual project within processing. Now that I had collected a reasonable range of skills within processing I thought I would create something a little more complex. My original idea was to create a digital timer or clock. For this I originally had a loop running and based on the loops value in seconds it would display the time. The time would be displayed through drawing different rectangles that would make up the digits. After creating this first part I soon after encountered my first problem.

I could display the first 9 seconds but when displaying the second set of digits I had difficultly in drawing them. The main way in which my program worked was based on if statements. For example if the loop was at 3 then display the rectangles that make up the digit 3. However I was unable to think of a way that enabled not only the first but also the second digit to display. I then had a discussion with Dan who suggested a far easier way of creating the program without having to have as much code as I had. He also introduced me to the concept of pseudo code which I then used in the shown image. I found this effective as it allowed me to then get a clear and concise approach on how I wanted to tackle my problem and create the program.

After this I then spent time at home developing a new approach to the program. I attempted to create arrays that would be made up of the rectangles and therefore the digits, these arrays could then be called instead of calling the individual rectangles each time. I would also only display these digits once, along the hours,minute and second positions and them simply offset the digits along the x axis. My new approach also included removing the loop I had created and instead using functions that obtained the time from the computers clock.

Despite this new approach I still encountered difficulties, such as trying to create classes that would be the digits, made up of groups of rectangles. I then tried creating arrays that would hold all the shape information but I found it difficult grasp how to achieve this, as in examples only integers or strings were being grouped and not shapes. Therefore I intend to talk to David in my next lecture to hopefully get some assistance with what I'm trying to achieve.

Today was the last lecture working on my project with the aim of hopefully uploading it to this site by the end of the lesson. After speaking to David briefly he showed me how to achieve what I wanted.

Instead of saving the shapes as a group in the form of either a class or array instead we created just a new variable called digit which would hold the shapes. This meant that I could remove the majority of the code present within my program as I no longer needed to draw each digit each time.

Once this was done I then looked at how to now display these digits by offsetting them along the x-axis. For this I change the value of the co ordinates to x or y if it was the same in each different digit. For example if the top left piece was included in a 6 and an 8 then it would have the same position value, this value was noted as x or y. I then looked at drawing the digits based on the hour, minute or second functions however by this point the lecture was almost over.

So sadly although I was not able to complete my project I did feel I learned a lot along the way. Although I was disappointed with the final result I think I learned other skills such as being introduced to the concept of pseudo code.
I also worked on changing my approach or view on creating something which I can see as being useful in the future. I also am now pleased I understand and can use the fundamentals of coding which I hope to progress as I continue this course.

WHAT IS PROCESSING? - SUB SECTION

Processing is an open source, visually orientated programming language. The following information was taken from the official processing website: http:www.processing.org

Processing is a programming language, development environment, and online community. Since 2001, Processing has promoted software literacy within the visual arts and visual literacy within technology. Initially created to serve as a software sketchbook and to teach computer programming fundamentals within a visual context, Processing evolved into a development tool for professionals. Today, there are tens of thousands of students, artists, designers, researchers, and hobbyists who use Processing for learning, prototyping, and production.

» Free to download and open source
» Interactive programs with 2D, 3D or PDF output
» OpenGL integration for accelerated 3D
» For GNU/Linux, Mac OS X, and Windows
» Over 100 libraries extend the core software
» Well documented, with many books available