Devlog 7 - About segment

Hi again! 5/5 segments are complete!!

About

This segment is just a short description on the ISS and a photo with cool animation

What’s next?

I’m not shipping yet, now I need to perfect this site!

1. Style the scrollbar
2. Fix some animations
3. Add some details

It’s near finish! Thanks for reading

Devlog 6 - Education segment

Hello everyone, 4/5 segments complete!

Education

In this section I embedeed 2 imo interesting videos from the ISS and a button that direct you to the ISS site!!

Obviously I’ve also added some animations and I fixed the animation from guide segment, sorry I forgot to put this in the video, but I think that it looks much better now!

If you’d change anything please let me know, I’d love to get to know your opinion!! Thanks for reading and have a nice day

Devlog 5 - Guide and Social media segments

Hiii! 3/5 segments finished!!

Social media

That’s just a segment with ISS socials (but the tiktok one is ESA’s account bc iss don’t have their own and esa post a lot from the ISS!)
But I’ve done this in such a… unique way!

1. The social media icons you see is just one full img
2. I added A B C and D text and centered it on these icons
3. Added href to these abcds and it’s working!
4. Last step - opacity: 0

But why this way?
I’m sure that there’s an easier way to do this but I’m not that experienced and I like to create things on my own, I came up with this and it works!! So yall remember, work smarter not harder!

Guide segment

I’m not so sure about this one. Please let me know - should I keep this animation, where the letters are “dancing”, or should I change it to some smoother animation? I kinda like it bc it’s like futuristic computer coding something vibe but idk, so pleaseee watch the video on the 3th slide and let me know below!! It would be highly appreciated!!!

Thanks for reading and have a nice day!

Devlog 4 - Astronauts Segment

Hi everyone!! 1/5 segments are finished!!
I don’t have much to say as I really like working with css and everything is always so smooth. I enjoyed doing the research and getting to know some interesting information about these people!!

In this segment you will find:

1. A lot of astronauts photos with cool animation on scroll at the top
2. Section about Peggy Whitson
3. Section about Scott Kelly

I decided to write a little bit about 2 people who did some iconic things on the ISS. I didn’t wanted it to be boring and I think that I found the perfect balance.

Thanks for reading and have a nice dayy!!!

Devlog 3 - start screen and a lot of styling!!

So the “raw” version is complete!! This, or so, is how it’s gonna look. Seriously, I love css so much it was so fun to make this!!

Ai usage

To the scroll element I needed to add 2 animations:

1. To make it “jump”, infinite
2. To make it fade while scrolling

I didn’t know how I can add 2 animations and therefore I asked ai. The solution is to add the second animation after a coma but it wouldn’t work very well bc I had, among others, animation-timeline: view(); it also helped me with this one and the solution here is to add auto, view(), normal, 0% and so on. A small thing, but it was really helpful.

What’s next?

1. I need to fill every section with many cool animations and information!!
2. I would love to add maybe an interactive background or just some animations bc rn it’s kinda blank

I love how it’s turning out and can’t wait for the final results!!

Devlog 2 - a complete rebrand!!

New Idea of the ISS hunt

I never wanted it to be a webOS, but when I created this project I just didn’t know what an OS meant lol, while working on spacecraftOS I really liked css, and I also came up with an idea..

I’m staying with the design and ISS is still gonna be the main character, but instead of building some advanced system I’m going to make a pretty website with a lot of animations. It will be a vast guide about the ISS!
Css makes me happy and fulfilled, I really enjoy learning new stuff about it. I’d love to create more beautiful and breathtaking websites. I can’t wait to improve my css skills!!

Yk stardance is ending soon, I wouldn’t even have the time to learn enough js

Also, I’m so grateful for all the reviews I got on spacecraftOS and a 18,53x multiplier!! Thank you all it makes me so happy!!! 😭💗

So, what I’d already done?

1. Deleted most of my code
2. Created header on scroll animation (you can see it in the video below)
3. Left the orbiting ISS bc I spent on it so much time, looking forward to find some use for it!

I think that I’ll just change the background colors as I’m looking at it now, lmk what you think!

Can’t wait to create more!! Thanks for reading and have a nice day

ISS HUNT - devlog #1

Hi! Recently I’ve been working on ISS hunt, a website that helps you catch ISS flying over your country! For more information check this project description.

1. What I’ve already done
   I’ve been focusing on the page design - you can see how it looks in the video below! I added ISS moving around the site, it wasn’t really difficult but as you can see in the video the spin on its own axis is taking it so much time - well, not anymore! I managed to fix it and now it’s just a brief moment.

2. What you can see in the video
   Besides the ISS you can see the upper band showing current time and day and below you can see few countries - what’s the plan? I’m starting with 3 countries, by clicking on them soon you will be able to open a window with several information about next ISS flyovers, such as where, when or the weather condition. I want to make it exist first, and then I will make it great! The plan is to make selectable options with all countries around the world, starting with these which you guys would like to see!

3. What’s next?
   I’m going to focus on few apps, that will provide the rundown on the basics of ISS

Thanks for reading my 1st devlog! And what about you? Did yall ever seen ISS flying over your country?