> ## Content Index > Fetch the complete content index at: https://www.gorillasun.de/llms.txt > Use this file to discover other available public pages before exploring further. # Gorilla Recap 5 - URL: https://www.gorillasun.de/blog/gorilla-recap-5/ - Published: 2023-05-22T15:11:31.000Z - Updated: 2023-12-19T23:12:12.000Z - Description: This week we wrote an introductory guide to P5JS, we built a portfolio page for the blog to showcase previous projects, we got selected to make a piece for Proof of X, and we continued working on some sketches! - Author: Ahmad Moussa - Tags: Newsletter **Hey everyone πŸ‘‹ and hello to all new subscribers that joined since last week! Thanks for signing up and joining along for the ride! This is the weekly newsletter, in which I recap everything noteworthy from the past week. Hope you have a good stay!** It's been a very busy week again! Among other things, I started working on a portfolio page for the blog, where I can showcase all of my projects. Demos in the attached tweets: > Continued working on my portfolio page ✨ > > Trying to add a navigation element, but the small icons look a little silly πŸ€” I prefer the bold titles a lot more. [https://t.co/TqgQ82kpGa](https://t.co/TqgQ82kpGa?ref=gorillasun.de) [pic.twitter.com/DI6Os7fQFi](https://t.co/DI6Os7fQFi?ref=gorillasun.de) > > β€” Ahmad Moussa || Gorilla Sun (@gorillasu) [May 18, 2023](https://twitter.com/gorillasu/status/1659268902751281164?ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) Instead of going the usual route and using a grid, or a masonry layout, I decided on doing it a little bit differently where each project is showcased as it's own card in a draggable carousel viewer. Similarly to the articles page, here we're also using the [glide.js](https://glidejs.com/?ref=gorillasun.de) library for the cards. The image slideshows within the cards are however custom made, using the [w3schools tutorial](https://www.w3schools.com/howto/howto%5Fjs%5Fslideshow.asp?ref=gorillasun.de) as a strating point. After I making a little prototype I quickly realized that there needed to be some sort of navigation to indicate how many projects there are overall and to allow the user to jump between the different projects, even if they're not chronologically adjacent. It ended up being a little bit esoteric, but I like how it indicates how many entries there are for every month: 0:00 /0:17 1Γ— Putting this together without having to manually type out all of the HTML code was also a challenge, I thought it would be best to load in a JSON file in which each project is it's own object. Each month being represented by an array of project objects: ![](https://storage.ghost.io/c/e8/51/e851bb8f-1e95-43e1-83eb-1b6ae9a0791c/content/images/2023/05/Image-58.png) Structuring JSON files and how you parse them within your code is tricky. The main problem with doing it this way, is that if any change is made to the strucutre of the JSON file, the JS code that parses it and constructs the HTML from it will easily break. I also still have to add a navigation element that allows toggling between different years. Is that the best way to do things? I'm not actually sure, but I'm thinking of making an offline version where I can also browse my code alongside each project. My hard drives have become a bit of a mess, and when I look back in 10 years I want to be able to find things, hence the importance of being a bit more organized about the archival side of things. Additionally, collecting all my projects will also take some time. In other news, Proof of X made an announcement: I'll be part of their upcoming live minting exhibition, a collaboration with [FxHash](https://twitter.com/fx%5Fhash%5F?ref=gorillasun.de) and [Kumaleon](https://twitter.com/KUMALEON%5F?ref=gorillasun.de)! Super stoked about it, and I've already started working on my sketch! ![](https://storage.ghost.io/c/e8/51/e851bb8f-1e95-43e1-83eb-1b6ae9a0791c/content/images/2023/05/Image-57.png) ## Gorilla Articles This week's post was quite an important one: Getting started with P5JS! The entire blog wouldn't exist if it wasn't for the wonderful P5 library, and hence this post is kind of long overdue. We go over everything required to get started with P5, it's aimed at complete beginners and I tried my best to explain things in such a manner that even someone who doesn't know the first thing about programming can follow along. If you know someone that wants to get into creative coding and generative art, send this one their way: [Getting started with P5JSIn this post we’ll have a look at p5.js, a creative coding and generative art javascript library. We’ll setup our first project, learn how to draw some shapes and get started on our creative coding journey.![](https://storage.ghost.io/c/e8/51/e851bb8f-1e95-43e1-83eb-1b6ae9a0791c/content/images/size/w256h256/2023/03/icon-1.png)Gorilla SunAhmad Moussa![](https://storage.ghost.io/c/e8/51/e851bb8f-1e95-43e1-83eb-1b6ae9a0791c/content/images/2023/05/plantsmember-1.png)](https://www.gorillasun.de/blog/getting-started-with-p5js/) There was no Sunday post, not because I didn't work on one, but because I didn't publish it. I caught up with family over the weekend and didn't have enough time to polish the essay. Sometimes my writing is a bit all over the place, especially now that I'm trying to post twice a week. But keep your eyes peeled, it'll be out sometime throughout the week. ## Gorilla Sketches I continued working just a little bit on my Tetrons sketch, trying to add a little bit of visual interest to the piece: > πŸŒƒ[#genart](https://twitter.com/hashtag/genart?src=hash&ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) [pic.twitter.com/txaTfwqirq](https://t.co/txaTfwqirq?ref=gorillasun.de) > > β€” Ahmad Moussa || Gorilla Sun (@gorillasu) [May 15, 2023](https://twitter.com/gorillasu/status/1658151626803228682?ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) The piece isn't quite there yet but I'm happy with the progress that I've made on it: > Sunday evening [#WIP](https://twitter.com/hashtag/WIP?src=hash&ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) [pic.twitter.com/ID2YpfKa6M](https://t.co/ID2YpfKa6M?ref=gorillasun.de) > > β€” Ahmad Moussa || Gorilla Sun (@gorillasu) [May 21, 2023](https://twitter.com/gorillasu/status/1660366888730349568?ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) I'll most likely release it on FxHash very soon! Besides this sketch I also started working on my drop for Proof of X - a little bit of different take on my irregular grids: > All the simple things 2 ✨🌊 [#genart](https://twitter.com/hashtag/genart?src=hash&ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) [https://t.co/UsXWUxp4rj](https://t.co/UsXWUxp4rj?ref=gorillasun.de) [pic.twitter.com/qMtE6V2tgR](https://t.co/qMtE6V2tgR?ref=gorillasun.de) > > β€” Ahmad Moussa || Gorilla Sun (@gorillasu) [May 22, 2023](https://twitter.com/gorillasu/status/1660617346753470466?ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) In the coming days you'll be seeing a lot more sketches! ## Interesting Reads of the Week ### P92 - A decentralised Twitter clone by Meta It's not certain yet when this app will be released but apparently Meta is working on a Twitter clone: [Meta is working on a decentralized social appMeta confirmed that it is working on a decentralized text-based social app that is internally codenamed as P92.![](https://techcrunch.com/wp-content/uploads/2015/02/cropped-cropped-favicon-gradient.png?w=192)TechCrunchIvan Mehta![](https://techcrunch.com/wp-content/uploads/2022/10/meta-distorted-glitched.jpg?resize=1200,675)](https://techcrunch.com/2023/03/09/meta-is-working-on-a-decentralized-social-app/?ref=gorillasun.de) And while we're at it, there's been some more changes to the Twitter algorithm - mainly concerning the weights that influence the tweet ranking component of the pipeline: > First, here are the new weights for ranking > > Every time a user engages with your tweets, you gain points on that tweet > > More engagements, more ranking > > As you can see, replies now have a bigger impact > > Getting your profile clicked is also big [pic.twitter.com/IBVowdq8rw](https://t.co/IBVowdq8rw?ref=gorillasun.de) > > β€” NFT God (@NFT\_GOD) [May 21, 2023](https://twitter.com/NFT%5FGOD/status/1660410005806358529?ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) ### The inner JSON Effect A fund and interesting read by TJ Mott recounting a new employees first experience at a company that had adapted a strange JSON-like system for their workflow: [The Inner JSON EffectJake eagerly stepped into his new job, grateful for more experience and new challenges, craving to learn new software stacks and see what his new company had to teach him about the world of software. They told him he’d be working on some websites, dealing with JavaScript, Node.js, JSON, and the lik…![](https://thedailywtf.com/favicon.ico)The Daily WTFTJ Mott![](https://thedailywtf.com/images/tj-mott.jpg)](https://thedailywtf.com/articles/the-inner-json-effect?ref=gorillasun.de) ## Tip of the Week On Mastodon I came across this cheat-sheet by Julia Evans that shows the different effects of bitwise operations: [Julia Evans (@b0rk@jvns.ca)Attached: 1 image how bitwise operations are used (I’d love to hear what folks find confusing about this one β€” still trying to work on the explanation here)![](https://mastodon.social/packs/media/icons/apple-touch-icon-1024x1024-db6849588b44f525363c37b65ef0ac66.png)Mastodon![](https://cdn.masto.host/socialjvnsca/media_attachments/files/110/391/772/302/871/529/original/09edbf0dc481cd67.png)](https://mastodon.social/@b0rk@jvns.ca/110391772625054741?ref=gorillasun.de) At the same time I also saw this reddit post where OP made a webapp that allows you to play with the different bitwise functions: > [A while ago, I created a web app to help me understand how bitwise operations work by visualizing results. It allows you to click on 0s and 1s to flip bits and see how the numbers change. I'm curious about what you think could be added or improved there. Any comments are greatly appreciated.](https://www.reddit.com/r/programming/comments/13ejv0z/a%5Fwhile%5Fago%5Fi%5Fcreated%5Fa%5Fweb%5Fapp%5Fto%5Fhelp%5Fme/?ref=gorillasun.de) > by [u/Grabowskyi](https://www.reddit.com/user/Grabowskyi?ref=gorillasun.de) in [programming](https://www.reddit.com/r/programming/?ref=gorillasun.de) Bitwise operations stonks! ## Things to Watch If you ever wanted to get into shader coding, then this video tutorial by [kishimisu](https://twitter.com/kishimisu?ref=gorillasun.de) is a must watch - it explains everything from the ground up and along the way you'll also put together a little 2D SDF sketch: > I've published my first youtube tutorial about shader coding! > > I used manim and shaders for the animations, and the entire voiceover is AI-generated (for audio quality reasons) > > My channel will focus on computer graphics, digital art and machine learning:[https://t.co/bfUZhVSHZu](https://t.co/bfUZhVSHZu?ref=gorillasun.de) [pic.twitter.com/Z2SL2kIxKr](https://t.co/Z2SL2kIxKr?ref=gorillasun.de) > > β€” kishimisu (@kishimisu) [May 20, 2023](https://twitter.com/kishimisu/status/1659937063163101184?ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) If you wanna give kishimisu a follow, they make all sorts of cool stuff actually - like this neural network powered hangman game: > I've implemented a CNN that predicts handwritten characters with which you can play the hangman game > > Still fully using [#glsl](https://twitter.com/hashtag/glsl?src=hash&ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) fragment shaders! > > You can switch the display mode to see the neural network in action > > Try it yourself! [https://t.co/b2Dl7VJSBp](https://t.co/b2Dl7VJSBp?ref=gorillasun.de) [pic.twitter.com/btmDLaZ0oC](https://t.co/btmDLaZ0oC?ref=gorillasun.de) > > β€” kishimisu (@kishimisu) [May 15, 2023](https://twitter.com/kishimisu/status/1658151216919003136?ref%5Fsrc=twsrc%5Etfw&ref=gorillasun.de) ## Music for Coding I discovered this album last December and it's quickly become one of my favourite pieces of music ever. Another one of those albums where you just have to click to know if the music actually matches the cover art - and in this case it absolutely does. It's one of those albums that you have to have listened to at least once in your life - my personla highlight of the album is an electric guitar Samba rendition of the Star Wars theme: ![](https://storage.ghost.io/c/e8/51/e851bb8f-1e95-43e1-83eb-1b6ae9a0791c/content/images/2023/05/Image-59.png) And that's it from for this week! Cheers, and happy sketching \~ Gorilla Sun!