I taught myself to code on a mobile phone – Part 2

TIGRESS

All content including videos and gifs have been created by Tigress on a mobile phone, using mobile apps. Through blockchain, sources and each stage can be recorded and credit given where needed. This is important for the future of online content and intellectual property.

🔶

Code in Visual Media

This video blog aims to demonstrate where my initial code, created when learning with SoloLearn on a mobile device only, has been utilized outside of the coding platform.

I hope to show how learning to code gives you a greater knowledge and abilty to understand and use apps or software created with code. 

Coding makes you better equipped to not only code at one end, but to work more efficiently and with more knowledge at the other end as a user of the software.

Instructions : 3 videos and 3 codes

1. Click blue text links to access and view the original codes eg. CSS3 code and SVG code.
2. Click on run at the top or bottom of the code, and follow prompts.
3. These codes are public duplicates of my original private source code.

3d CSS3 Underwater perspective

Sound on for full immersion. 🔊

The main background and upper surface view were created with CSS3 coding – perspective 1 and CSS3 coding perspective 2, by manipulating the perspective of an image. The shell was animated at the code stage and is an emoji that gets supersized when put in a coded 3d box at a specific degree in relation to the other objects in the image . If the degrees of transformation are incorrect the whole collection of images and moving parts collapse. I found that sweet spot that allowed the tiny emoji to become supersized and move as a projectile, while keeping the finely positioned balance of all the space and interwoven images (objects) around it.

Original image / gif

This one image was transformed through coding different angles and positioning . This image is the main background, and then separately positioned again for the water surface (top) view.

It was then transferred to video format using an app called Power Director. ( It has a free mode as well as paid Pro modes where you can pay per month, quarterly or annually). It uses terminology used in coding, of which would have taken me longer to understand how and where to use each process, without coding knowledge.

I animated the turtle by digitally dismembering one turtle image using the app Pixomatic. I used the animation process of positioning each body part in a series of still images, to create the moving turtle in the video.

In an interactive format on a platform such as gaming, VR or Augmented reality, each body part could be animated and controlled by the user.

SVG Stargate

Sound on for full immersion. 🔊

This was my first finished, start to end code, using HTML and SVG.

As someone who studied art the use of color (inversion of color and opacity at the coding phase ) was used to give an illusion of the pyramid and stairs. This also gives an insight into its construction from the minds perception to reality.

Cats and the sun go hand in hand !!!

SVG uses coordinates, like those used in digital map software that most people have used.

The main section of this was created with SVG Coding with no external files or libraries,( the entire code is there to see) , then transferred to video format. The original code was quite heavy to do on a mobile device ( it was slow to load and I experienced some lag, for a phone it was heavy in visual code), but could be finished with a dramatic use of music, sound and special effects all of which I created, mixed and edited in the audio and video app or software on my phone.

3d Animated flower bed

Sound on for full immersion. 🔊

This was created with CSS3 code then transferred to video format and a gif format, all created with apps which in turn were created with code.

I experimented not only with 3d imagery, but mainly with perspective. How one image or object can be perceived differently from different viewpoints.

Gif format

Gifs are a good medium to convey a message or promote something. Animation tends to grab peoples attention. They are usually accompanied with text rather than sound, which adds to their ease in loading quicker on your device.

OK, I know what some people are thinking !!!!!!!! But remember everyone has a different perspective. This represented relaxation and happiness, to me.

Anyone who is in advertising and marketing or uses social media, would be aware of the advantages of this medium.

In coding terms it loads and is coded as an image rather than a video, and runs in a loop.

Original image

I experimented not only with 3d imagery, but with perspective.

🔶

I hope this demonstrates how one image or object can be perceived differently from different viewpoints.

Coding is a driving force behind most modern and future forms of visual media. – by Heidi M (aka – Tigress)

---

Coming Soon

Part 3 – The Dynamics of JavaScript and JQuery.

Follow this blog by entering your email in the section below or in the side bar.

---