I believe that it is always important to keep up to date with software, the new technology gives us new things to learn and it help artists and designers produce work much more efficiently and also visually pleasing. For instance, Adobe's version of Photoshop CS4 and onwards are capable of producing 3D material.

--------------------------------------------------------------------------------------------------------------------------------------

Jake Nicholls - Conversation with employer

William Turn Ip October 6 at 8:19am
yeh thats what im not looking forward to doin, less pictures and more reading lol hence the reason why i chose a creative subject :/ is it tough because of the recession or is the graphics industry like that in general?
all your work is amazing, i wish i could get up to that standard. do you use PS swift3D for the 3D texts?

Jake Nicholls October 6 at 8:22am Report
Thank you for the kind words mate, much appreciated!

Its tough because of the recession, but tricky because of saturation too I think, there are a lot of people out there doing the same thing, I guess the same in most fields from speaking to people I know.

I use a few, but mainly used 3DS max as its what I used when I was doing my HND.

--------------------------------------------------------------------------------------------------------------------------------------

The majority of flyers, posters and logos these days look 3D which gives the design or company an up to date or modern look. I think that it is essential to learn 3D software to keep on top of the competition in the design industry, so in this blog I will be going through the process of learning the latest design software.


The interface in most of the Adobe programs are near enough the same, I am use to using the keyboard shortcuts and navigation but having to totally change from what I have been adapted to for years, I began to feel like a beginner again.. seriously feels like I was back on the first year of college!

As I could remember, Adobe Illustrator was the first piece of software I used for 3D text, it was very basic and cartoon like but it did the job. This was before I knew what software to use, here is how amateur and crappy it looks in Illustrator.



--------------------------------------------------------------------------------------------------------------------------------------

Using new software isn't easy, I found a tutorial on a website explaining about the Cinema 4D interface, having read the tutorial and trying to understand the tools, shortcuts and options, most of it didn't make sense for example; spline drawing tool, add array object, emitter object etc.

http://cinema4dtutorials.com/basics/cinema-4d-interface-tutorial/

After a while, I gave up because it became too much for me to take in all at once, I realised that to understand a piece of software you need to follow small tutorials and just play around with it and you can't just jump in by reading what's this and where's this.

--------------------------------------------------------------------------------------------------------------------------------------

After a few days of using Cinema 4D, I have managed to adapt to it and only know what I is required. The software is widely used for video and animation but I only use it for 3D text designs because it is what I use in my posters, flyers and logos for my clients, so only learn what you only need.

Here I have used the software Cinema 4D , I have had about 2 months experience using this program but haven't managed to record my progression of learning with it. These are the recent things that I have been learning.

Recently I have been mixing Cinema 4D with Photoshop and have always had to use a blue background behind my image to cut it out; in other words extracting the object away from the background.

http://simplegfx.net/?tag=remove-the-black-background

After following this tutorial, I can now completely remove the background without any other colours interfering with the image I want cutting out. With the use of this technique I can now import separate objects from Cinema 4D to Photoshop and touch up on shadows, shading and layering effects.

This is what I did for a client:



Cinema 4D also recognises vectors and paths which is ideal for designing 3D logos.







I also use Autodesk 3D Max for text related designs, the software does a similar job to Cinema 4D and I use it for a certain style I really like. Have a look at this tutorial:

http://www.videocopilot.net/tutorial/3d_text_in_3ds_max/


I like to use 3D Max because it is much faster to run and in my opinion, much more easier to use. The only problem I am having with 3D Max is when I enlarge the outline of text, the letters G and S goes weird. Here have a look:


One way to solve the problem is to select the keep lines from crossing option, but it separates and gaps each letter, which is not what I would recommend because it ruins the shape of the text and doesn't work with the technique I am about to do. This is what happens:


And now for some reason the P is starting to fault, but anyway.. I resolve the problem by separating the letters G and S away from the rest of the alphabet then replacing them with spaces. Here's a video of what I did:



--------------------------------------------------------------------------------------------------------------------------------------

After a tutorial with Graham, I decided to focus on web designing because its something I don't know much about, with the use of my graphic design skills, I can tie the two skills together and I know for sure that they both work well together. Web design is an important skill to learn because of today's industry, every business or company needs a website because it gives out information or sells products etc, and with my visual design skills I can help enhance and draw customers in.

One of the main problems and things that annoyed me the most in Dreamweaver were placing images or objects on a page that snapped on the left and right, there are no ways to snap to the centre. I want to be able to move my images freely and not be forced into a fixed layout.


It annoys me so much because it snaps right to the edge of the page and if you write text next to the image, they'll appear to be touching.

The same problem occurred with Microsoft Word, the 'In Front of Text' 'Behind Text' and 'Square' were only solution to move placed images freely.



By playing around with the Dreamweaver settings at the bottom left panel, I found a way to move the image to the centre of the page, adjusting the H space creates an invisible border which pushes the image away from the left alignment. The only problem is that no text or any other images can be placed within this border.
My biggest problem with Dreamweaver is the restriction of moving things anywhere you want.


--------------------------------------------------------------------------------------------------------------------------------------

After lots of browsing through the internet, i came across a solution to my problem, its a technique that will enable me to move my images anywhere in Dreamweaver.

This is the website, that gave me the solution to the problem:
http://www.adobe-masters.com/dreamweaver/what-is-ap-div-how-to-move-and-position-text-image-or-banners/

"Have you ever had a problem moving an image from the bottom of the page to top right or top left? Or how can I place the banner or picture beside the other ad or element? Many have experienced such a dilemma and the element never moves no matter how hard you try. Well AP Div solves the problem."




After figuring out how to position images and text freely it has generated another problem, 'absolute positioning' has its disadvantage because people have different size monitors so the AP DIV objects are placed in a position that doesn't suit with the DIV TAG objects. So I would recommend placing all the content and objects in either AP DIV or DIV TAG.


These two images show different monitor resolutions with the same web browser and content; all done with DIV TAGs. However much you extend the web browser window, the content will always be left, right and centre. Oh and I found out how to centre objects now; it was the most obvious thing to do.


I used the same stuff here but used AP DIV on all the content instead, to be honest they both work well either way but I think that AP DIV is better for visual websites because of the overlapping and freedom to position and making it look whatever way you want.

I asked Jason Lowe, a peer in my class for some advice and he would recommend designing a website through Photoshop and slicing them up to sections. Sounds like a much more easier way since I can use Photoshop very well.

--------------------------------------------------------------------------------------------------------------------------------------

I've been trying to find out what content all websites need, this will help me section and structure my website. But first of all, I need to think about what my website is about and the content that is going to be included :/

http://articles.sitepoint.com/article/content-rich-website/2

"You know best - or should - what your audience wants. It then becomes an easy task to decide about which types of content will best serve their needs and how to go about finding or creating it. Here are some suggestions:"

· Editorials
· Feature articles
· News clips or stories
· Art galleries
· Aggregating the best content
· Reviews
· Announcements
· Interviews
· Interactive features - polls, feedback, discussion groups, forums, chat

--------------------------------------------------------------------------------------------------------------------------------------

After a long think of what my website could contain, I have decided to create an online portfolio of all my graphic design work.

·Home
·Portfolio
·Contact
·Links
·Blog




This is the tutorial I followed to create a navigation bar, it is very important because it sections the website so that I won't get confused and it will help guide users who are viewing my website.

--------------------------------------------------------------------------------------------------------------------------------------

I started off by making a simple basic design for my website, nothing special or colourful yet because I'm just getting the hang of it. To be honest, it does look boring and plain but at least its a start to something new.

Did everything in Photoshop, each box or element is a separate layer. I'll deconstruct them to give you a better understanding and overlook. Rollovers (top right) Background (bottom right)
These are the basic designs that are on every page, this gives me a base to work from, text doesn't need to be saved as an image file because it can be added in Dreamweaver.


Instead of having to save each individual layer in Photoshop as a PNG manually, there is an option that I would definitely recommend to anyone exporting from Photoshop to Dreamweaver.
This has helped me save so much time and frustration!

http://livedocs.adobe.com/en_US/Photoshop/10.0/help.html?content=WSfd1234e1c4b69f30ea53e41001031ab64-7760.html

Now watch all your all your layers get saved individually and automatically, now have your coffee or cigarette and wait :)


On the portfolio page, I needed to find out how to create a photo gallery of my images and fit everything on the same page without scrolling down because I want the website to be the same proportion all the way through; comfortable experience I think.



Instead of typing up the html code for a photo gallery, you can get the extension for Dreamweaver to do it for you, but you need to register to download it.

http://www.adobe.com/cfusion/exchange/index.cfm?searchfield=thickbox&search_exchange=&num=25&startnum=1&event=search&sort=0&interim_dummy_tmpfield=&Submit=

It is written in html but you can change the image and its job in design mode too.

Copied and pasted the html and image into the AP DIV box just to add another photo gallery image but for some reason it won't paste to the front but stay behind other layers, I've tried everything out like putting the layer on top other layers but still doesn't work. Creating a new AP DIV box is the only solution that can resolve this issue.



But anyway, here's what the code did for me and I am very impressed, here's a video of what the photo gallery does on my website.




Oh and I have recently started to use a program called 'camstudio' to record my desktop, I would recommend this to anyone doing graphic design, vis comm and anyone who uses the computer to do their work. Its such a great way to record your process and documenting work done on the computer, very easy to use! A lot easier than having to explain something when you can just show a video hehe.

Here is the link:

http://camstudio.org/

This is a must have piece of software and will help you throughout your blog or even the course your doing. Really does make things much easier and I will certainly use this in future.


After I designed my basic website, I wanted to create a form so that people can get in touch with me. Something like this:

There were many sites I looked at that gave me the code for the user to type in information in the boxes but no code for a submit button and some tutorials gave me a submit button but no function.

I finally came across this website which gave me the html code for a form, submit button and function.

http://www.htmlcodetutorial.com/help/archive.php/o_t__t_366__submit-form-how-to.html

I know.. I know.. there's a lot of letters and characters there but no worries. This is what I did to put my contact form on, I have shown you how to do a few tweaks in the code so that you understand how to personalise it for your own needs. Sorry I don't have a microphone to explain what I did but I'm sure you can follow where my mouse goes.




Finally finished my portfolio website and I will show you a video of what I have done.




--------------------------------------------------------------------------------------------------------------------------------------

Ok, time to take web design to the next level. The website I did for my portfolio is very basic and normal, the majority of websites I have looked at have so much interactivity and visuals in it. Like I said.. always keep up to date with the technology.

Here's a list of websites which have inspired me but look really hard to do but I'll figure out how to something similar one day.

http://www.brokenrecordsuk.com

http://www.callyandjuice.com

http://www.bionicevents.com

http://www.bassbandits.co.uk

Spoke to the designer who made these websites..

Will 12:16pm
is there better software than 3ds max?

Jason 12:16pm
i'm sure there is

Will 12:17pm
what software do u use if u dont mind me asking?

Jason 12:19pm
i dont give away my secrets - sorry!
my software and techniques are what give me my edge
if i lose that, ill have nothing

He wouldn't give me any advice so I'll have to find out the techniques myself..

The next thing I'm going to try and learn is interactivity.


When I right click on well animated sites, it always shows this box. You need flash player to load these sites up and I assume that the website was designed in Adobe Flash.




This is the sort of level I would love my web designing skills to be.. got 5 days till the deadline so going to try learn how to do it.





Followed this tutorial on how to make a flash website, I'm going to start off with the basics of making a few pages on Flash CS4, just to get the basics and the elements you need for user experience.

At 3:38 it tells you to put in a function, with lots of writing and characters just to do a certain job! I don't know if I can cope with learning the scripts for the actions, surely there's an easier way.

Since Flash is an animation and moving image software, it automatically uses the frames as a moving image and not as a page to stop and view. So you must have a script to stop it from moving onto the next frame automatically. This is what happens to my website without any scripts..



But about the scripts.. I'm OK with using the stop script (stop();) because it is easy to remember but linking the buttons with different pages using long codes will be very frustrating and time consuming!


After copying the codes, this is what happened. GRR..



What have I done wrong?! I copied every letter and character that was needed in the script and this happens!

After a short while, I realised that the problem was the letter 'V' in void because it needed to be a lower case. This shows that scripting needs to be very precise and exact, I can't believe the problem was just because of an upper case letter. It'll be a nightmare if there were a lots of letters that were wrong in a script in a big website.

The tutorial was easy to follow but I can't be doing with typing a script to do the simplest things, so I am going to look at other tutorials on how to make a flash website but with a different technique.




Followed this 40 minute tutorial and was very well explained, something much more interactive and animated, which is what I was interested in. Took me overall about 3 hours to understand everything because I kept on pausing and repeating the tutorial.

Animating a button :) can't be explained any easier.

After designing my new flash website, it began to go down hill. Some faults occurred in the script, so it started confusing me and I couldn't find where the source of the problem is :( It's either give up now and waste more time or try again and really look closely of what I need to do. The main problem was the navigation around my website and the interactivity. Buttons didn't work for some reason and I couldn't link things to scenes or links. Such a nightmare, and you also need to name literally everything so that you don't get confused and to link objects with other objects too.



After looking for some more inspiration, I came across these website designs and I was like WOW!

http://www.templatemonster.com/flash-templates/16323.html

http://www.templatemonster.com/flash-templates/14579.html

http://www.templatemonster.com/flash-templates/22466.html

To be honest, I'm not even going to attempt to try and make something like this, since there is only one day before the deadline. But I would love to learn how to do this one day in my own time.



After making my animation for an intro, I couldn't make the enter button go back to scene one, I have tried everything I could possibly find to link the button to another scene or page. but unfortunately I have ran out of time.. have to hand in the project now.. oh well, it was fun while it lasted.




Here is the list of the software that I'm capable of using at the end of the Communication Technology brief:

• Photoshop
• Illustrator
• PS Swift 3D - Photoshop extension
• 3d Max
• 4D Cinema
• Dreamweaver
• Flash

Since trying to learn flash web development which went horribly wrong, I think I'm going to make something a little less complicated in future.. something like this:

http://tympanus.net/Tutorials/CollapsingSiteNavigation/



At least my Dreamweaver website is a success :)