fix: we portfolio skeleton

courses/portfolio/03-structure/README.md

@@ -11,11 +11,13 @@ Chose carefully what to you use as a head of your page. It is the first thing a
     A senior developer reading your portfolio is more interested in developers eager to learn, humble, and looking for guidance so they will have a easier life hiring you.  
 
 ## About
+
 This is a summary obout yourself, be brief and achievement oriented. What and who you are. Contact info via social 
 medias. State your working status and target. If you are a narrative centred person, you can create something fancy 
 here, but dont over-do, less is more!
 
 ## Showcase
+
 - Projects
 - Ability and versatility
 - Community Contributions
@@ -31,19 +33,23 @@ You can showcase your personal work, a job you make for a client(if authorized).
     Avoid using percentage graphs to showcase your proficiency on specific tech stack or tool. The main reason is: how do you grade of your ability as 80%, 100% or 30%? Worse than that, how can the reader be sure of that? If you want to do that, it is better to apply for certificates, there are plenty on linkedin or specialized sites.
 
 ## Achievements
+
 - List key achievements and skills. Dont use any kind of grading
 - Education
 - Testimonials or anything to prove your skills and capacity
 
 ## Project Details
+
 - You should create a way to explain more about what is showcased. Ex.: redirect the user to the project description page, or open a modal
 
 ## Blog
+
 - Featured posts/content and call to action to read your ongoing content production
 - Explain your process in designing a game or piece of software
 - Explain some interesting details you learn or describe your knowledge explorations.
 
 ## Contact
+
 Explicitly state what people should expect if they contact you and what they can expect from your return. Ex.: If 
 you aim to be a freelance, state your offer and ask for them to briefly state the job activity, time frame and the rate 
 they are willing to pay. If you are looking for a full-time position, the most common way is to just share your email, so they can contact you.
@@ -52,38 +58,46 @@ Another option is to list all of your social medias, but dont overuse this. Nowa
 you list all of them, there is chances, you are not active there and the link will guide the reader to a empty and 
 haunted house and they will not engage.
 
+## General tips
+
+- Keep the Target Audience in Mind
+    - Take Advantage of Your Homepage 
+    - Make Your Portfolio Scannable 
+    - Minimize Clicks
+- Remember UX and UI 
+    - Go Mobile or Go Home 
+    - Optimize Website Performance 
+    - Remember Accessibility
+- Showcase Your Best Work and Skills 
+    - Share Your Code and Live Projects 
+    - OR Provide Code Samples and GIFs 
+    - Boast Freelance and Personal Projects 
+    - BUT Be Selective 
+    - Prove that You Are on The Same Page
+- Show Your Personality
+    - Use Custom Domain
+    - Make Use of Introductory Statement 
+    - Use Your Tone of Voice 
+    - Share Your Motivation (Optional)
+- Maintain Personal Brand 
+    - Keep Portfolio Up-to-Date
+    - Include Testimonials
+- Encourage Communication
+    - Call-to-action button or link to contact 
+
+[reference](https://www.actitime.com/productivity/how-to-build-a-great-developer-portfolio#use-your-tone-of-voice)
+
 # Homework
 
-1. [Optional]Create a wireframe draft of what you are going to do on [figma](https://www.figma.com/), [miro](https://miro.com/) or any other tool you find relevant. If you already have a Portfolio page already set, try to think on how do you make it be responsive on mobile devices.
-2. Scaffold your project in github. Describe in the README.md what you are going to do in your demo. You might try to convince a colleague to work with you. You can do more than one demo if you want. Some examples:
-   - Follow some of mobagen AI examples from here https://github.com/InfiniBrains/mobagen check some of them running here https://infinibrains.github.io/mobagen/ 
-   - Raytrace demo for cloud and Human body. ref https://www.youtube.com/watch?v=Qj_tK_mdRcA
-   - Networking game using the phone as a controller and your portfolio demo as the viewer. https://blockrage.pgs-soft.com/
-   - Catch the cat demo for AI. https://llerrah.com/cattrap.htm
-   - Create unity editor plugin to dynamically generate meshes via splines based on sample locations. https://www.youtube.com/watch?v=f5Q7Z2KxILE is a game with 50million downloads that used this technique to generate scenarios. Here you can watch a better explanation. https://www.youtube.com/watch?v=saAQNRSYU9k
-   - Embed a shader toy behind your portfolio page. https://shadertoyunofficial.wordpress.com/2018/02/17/embedding-shadertoys-in-website/
-   - A nice collection of fun ideas to code for your portfolio https://mrdoob.com/
-   - Board game simulation. Ex: chess https://www.chessprogramming.org/ or https://github.com/JuUnland/Chess/ or this https://www.youtube.com/watch?v=WKs685H6uOQ
-3. [Optional] Simulate a real test by creating a console based space invader in 48h. 
+- [Optional]Create a wireframe draft of what you are going to do on [figma](https://www.figma.com/), [miro](https://miro.com/) or any other tool you find relevant. If you already have a Portfolio page already set, try to think on how do you make it be responsive on mobile devices.
+- Scaffold your project in github. Describe in the README.md what you are going to do in your demo. You might try to convince a colleague to work with you. You can do more than one demo if you want. Some examples:
+    - Raytrace demo for cloud and Human body. ref https://www.youtube.com/watch?v=Qj_tK_mdRcA
+    - Networking game using the phone as a controller and your portfolio demo as the viewer. https://blockrage.pgs-soft.com/
+    - Catch the cat demo for AI. https://llerrah.com/cattrap.htm
+    - Create unity editor plugin to dynamically generate meshes via splines based on sample locations. https://www.youtube.com/watch?v=f5Q7Z2KxILE is a game with 50million downloads that used this technique to generate scenarios. Here you can watch a better explanation. https://www.youtube.com/watch?v=saAQNRSYU9k
+    - Embed a shader toy behind your portfolio page. https://shadertoyunofficial.wordpress.com/2018/02/17/embedding-shadertoys-in-website/
+    - A nice collection of fun ideas to code for your portfolio https://mrdoob.com/
+    - Board game simulation. Ex: chess https://www.chessprogramming.org/ or https://github.com/JuUnland/Chess/ or this https://www.youtube.com/watch?v=WKs685H6uOQ
+- [Optional] Simulate a real test by creating a console based space invader in 48h. 
     - Efficiently draw (print on console)
     - Efficient collision check
-
-# Most requested topics to be covered in this class
-- 13 #AI #flocking #BoardGames #MinMax #chess #procedural
-- 5 #gameplay
-- 4 #Rendering #vfx #grass #leaf #water #graphics #shader
-- 4 #UI #UX
-- 4 #networking
-- 4 #interview #questions
-- 3 #XR #VR
-- 3 #tools #unityeditor
-- 3 #backend #devops
-- 2 #physics
-- 2 #PortifolioPage #website #responsive
-- 2 #CV
-- 2 #github #githubpages
-- 2 #writing #narrative
-- 2 #itch
-- 1 #soundtrack #audio
-- 1 #LinkedIn
-- 1 #security