WeatherLounge

WeatherLounge Used AI

46 devlogs
46h 6m
•  Ship certified
Created by Imran

Weather Lounge is an attempt at essentially 'gamifying' the weather!

Timeline

Earned sticker

I decided to leave the text input out, and start working on the rain/snow building up feature, as there isn't that long till the end of SOM. Definitely not cause it was annoying me...

Update attachment

Currently working on allowing input of time via text.

Update attachment
Earned sticker

I'm back 😂. I added a continuous stream of smoke to the flame. And I was trying to get the melted frost lines to be able to extinguish the flame.

Update attachment

I had a working hour and minute hand but there was a bunch of issues so I decided to stick with minute hand control only. Considering the clock's pretty small its not too bad. Only issue I think right now is that when I am on the snowy theme at say sunset and hit sunny everything except the sky and clouds acts as if it got sunny instantly. I'm also waiting to see if the Figma wakatime extension will get fixed soon. If it does I'll re-edit the background and then probably reship before trying to add the rain and snow building up.

Update attachment

I was able to fix the clouds, and changed the old icons to the numbers for the clock.

Update attachment

I've decided I'm just going to make it a normal clock. Currently the hour hand moves more than the mouse turns. Also the clouds now change colour smoothly during day change but not when you use rainy/cloudy theme so I'll try to fix that now.

Update attachment

After messing about with it I think I might make the clock a normal clock? Cause it does seem pretty odd. But i'm not sure if I should use a normal clock tho. It still needs work even now - if you tap a point in the clock it doesn't transition smoothly to that new time. Also the clouds don't change colour smoothly. If I can get those done I'll try add the snow/rain buildup uh and maybe re-edit the background.

Update attachment

Does the clock look better on the right or left? I think its a bit too cluttered on the right but looks like it was designed to be there, so I'm not sure... I'll probably keep it on the right for now at least.

Update attachment

The sunrise looks much better than a completely orange sky 😅. I added a clock as well. I'm aiming to make it look like an actual clock and maybe put it in the top right just left of the tool selector. Also the clock seems to override the smooth transition so that's something else to fix.

Update attachment

The issue with the snow realising a bunch at the start instead of a nice gradual release has been fixed! Next I think I'll try make the sunrise/sunset colours look better, then maybe a clock that controls the time and then the snow/rain buildup.

Update attachment

The sunrise sort of works! Doesn't really look great - the whole sky is just orange - but at least it's decent now. I'll try to make it look better maybe probably by having only the bottom of the sky orange. I also realised the snow was releasing a burst of snow at the beginning so I'm working on that as well. I was thinking maybe i should add a clock style thing that allows you to change the time to experience the different themes in different themes.

Update attachment

It was kinda hard to screenshot but there is now a small explosion when you change to a warmer theme! I think it needs to 'explode' a bit before the theme change finishes, maybe using the sun position or a temperature threshold (I think the temperature threshold sounds better) rather than waiting for the transition to fully complete. Also the mouse can now interact with the rain/snow even without the umbrella but with a very low force. The Sky still needs work e.g., when you change theme during transition the sky changes colour quickly rather than staying smooth, and the nice sunset/sunrise colours still need to be added. The snow/rain buildup idea sounds really good I think I'll try to add that.

Update attachment

I tried to screenshot the flame/heat tool melting the snow. I'm thinking of trying to get the flame to be more intense in warmer themes and maybe even adding snow buildup / floods? Then we can add more tools and I think it could be more fun allowing you to play around with water/snow physics! Sounds a bit complicated but I think its possible. I should probably get the sky up to standards first though 😅... uh and the background recrop.

Update attachment

The flame now extinguishes under lots of rain! The screenshot shows just after the flame has extinguished. Now I think I'll try make the snow melt and interact with the snow, and maybe the mouse should always interact with weather and the umbrella just effects it more?

Update attachment
Imran
Imran
1h 10m 28 days ago

I've kinda got the soot working - it builds up over time and you can shake it off or use the rain to remove it! But it doesn't look that good. I also think the flame should extinguish after a lot of rain.

Update attachment

The heat tool is starting to look alot better - at least I think. I was trying to screenshot a mouse icon I was thinking of adding but it seems its not very easy, so you're going to have to accept the split screen😂. The mouse icon doesn't really look that good - The idea in my head was it would act as if the mouse caught fire from the heat/flame tool but I think I have a better idea! Whereby 🤓 the mouse turns black as if it gets burnt by the flame and either using the rain or shaking the mouse really quick is required to remove the black burnt bit which then falls off - making the mouse normal again.

Update attachment

I spent soo long in figma trying to edit the background but it seems that I may have messed up somewhere and it isn't a fully closed shape... I probably should've done it in parts. I also don't think the time tracked, meaning all that time is just gone. Anyways I've decided to start to work on upgrading the heat function and leave the background for another time😂.

Update attachment

I think the sun/moon orbit is kinda fixed now. If the time that it needs to change to is fairly close then it will go backwards rather than going through a whole cycle. I'll probably try get wackatime setup and then re-edit the background image. And then maybe I'll decide if the clouds should only roll in or also fade in?

Update attachment

I've got quite a few of the simpler goals done! I fixed the melt drips disappearing and the rain/snow losing interactivity after you've switched to the sunny theme. I'm also working on improving the sun/moon orbit, I'm thinking of making the 'horizon' higher so it matches the mountains or just below so it's obvious the sun is setting and not just being hidden😂. I think I'll also try to add the nice transition with the sunrise/sunset and reedit the background image tomorrow!

Update attachment

First ship went pretty well! Its given me an extra boost of motivation 😅. I just slowed down the sun/moon orbit and stopped the meltdrips fading out. Here's a really rough plan of what I'm thinking of doing: frostlines melt speed vary based on theme change, Re-edit background image, maybe make clouds fade in if theres wayy too little? Later: Heat visible everywhere not just card and melts snow, Improve sun/moon orbit + sky (sunset/sunrise), Better heat effect (Flame?, mouse icon lit on fire, mouse icon with umbrella attached). Should the mouse icons vary or maybe have a draggable tool instead of it being based on the mouse?

Update attachment

Ship 1

1 payout of shell 835.0 shells

Imran

about 1 month ago

Imran Covers 26 devlogs and 34h 33m

After delaying the ship so much I decided to just get things working and go for the ship. I changed the emojis to icons as well.

Update attachment

After a very long break I've got the site actually working again! The lightning doesn't lag the whole browser, it still needs a few tweaks though. There's a bunch of minorish things i want to get done to day and then hopefully I will ship today.

  I also kinda updated the ReadMe. I say kinda since it wasn't much of an upgrade...
Update attachment

Yeah... I was initially planning to ship before the end of this week, but, I don't think I'll be making that. I was trying to improve the 'frost lines' by making them melt when you change to a warmer theme instead of just disappearing, but its another thing to add to the list. I still have to improve the sun/moon transformation, fix the lightning - although it is a bit better since the last fix, add back?? the shadow/shade in sunny theme, make the rain be interactive with the umbrella in the thunderstorm theme, making the melted frost lines 'freeze' into snow. There's probably more that I'm forgetting as well. It feels like I'm close to finshing the project and also soooooo far.

Update attachment

The lightning is a bit better but I want it to come from the clouds. I'm still having problems getting the sun and moon right...

Update attachment

I took a small break from the transformation thing and realised another problem... Why is the lightning making the whole browser lag 😂. Another problem added to the list.

Update attachment

Oops... This transformation things is taking a lot longer than expected. I'll try at least get a working version today!

Update attachment

Uhh, yeah I think it's going to be awhile 😅... The black background really makes the bad editing more apparent. I think I should re edit it, but after I get it working again. I also don't think I mentioned it before, but the more realistic lightning I tried to make also wasn't working. I have to get the transformation thing working first tho, cause I can't even change the theme to test the lightning rn.

Update attachment

I attached the original image that I then edited - pretty poorly - to use as the back ground. I'm debating as to whether I should try to do a better editing job... Currently I'm still working on getting that transition working, I also organised the code a bit.

Update attachment

I'm still working on getting that transition to look good, but I have ̶f̶i̶n̶a̶l̶l̶y̶ fixed the night theme to actually have a night time looking sky.

Update attachment

The rain now comes from the clouds now! The sky also changes based on theme - I just need to fix the sun and moon movement based on the theme as well as adding a nice day change transition.

Update attachment

The clouds look a lot better! I also fixed the drips from the 'frost' to fall past the weather card. I still need to have more clouds and darker ones for the rainy and thunder theme. I'm now thinking of fixing the sky change based on theme and maybe add a button that takes you back to your time or would the searching function be enough? And making the rain look like its come from the clouds, and actual lightning strikes rather than just a white screen flash 😅. Maybe I can reuse some of the frost line code for the lightning strike function?

Update attachment

Not looking too good... I'll try to improve its looks but also have different versions for stormy/rainy theme - cause it currently looks pretty weird in the rainy theme 😅.

Update attachment

Currently fixing some bugs to do with the heat trail, but after that I'm looking to improve the clouds. I also realised that if I ̶f̶i̶x̶ improve the night theme so the whole sky, moon and sun go into 'night mode' rather than stars just becoming visible I probably wouldn't need the time slider. I could even have an animation when you click night to show a sped up change of day.

Update attachment

Just fixed the shadow to show in the sunny theme. The torch is now fainter in the brighter theme rather than just being off. I've also decided it would be much easier to just have the rain go over the weather card rather than having another effect for it. The next feature I want to add (after fixing this stuff that is) is a time change slider as currently the sun and moon are being modelled - and I think with the slider it would allow for that effect to be seen.

Update attachment

The navbar's and the torch are working. I've also got a shadow based on where the sun/moon is, the idea being the umbrella can provide 'shade'. I think it'll probably be easier to have rain overlay the weather card rather than having separate rain for the weather card cause trying to detect the umbrella being over the weather card and react accordingly and look clean isn't working out too great 😅.

Update attachment

Currently trying to get the umbrella to add shade in the sunny theme

Update attachment

I didn't even realise the tool bar was missing 😂. Just got it back - I need to make the tools work on all themes. The heat trail is looking better but it needs to have more of the heating up part. The melting of the frostlines works! but it needs to be more visible i think.

Update attachment

It's not very clear in the screen shot but I've added detection of when your covering the weather card for the rain effect and a heat trail. I now want to add detection of when your above the weather card region. As well as improving the heat trail - it currently only has the heat trail effect when covering the frost effect.

Update attachment

Sorry for the absent of devlogs I was away - I was coding on my phone via remote desktop😂. I was able to fix the sounds and the frost lines work. Currently I want to make it look a bit better and then move to improving the rain effect on the weather card so it detects if you are covering the card with the umbrella. I'm also considering changing the mouse icon or maybe switching to an umbrella tool... Still haven't decided.

Update attachment
Imran Imran about 2 months ago
I’d also like to add a heat trail.

The good news is I finally got around to the background! The bad news is my not so great photoshopping skills are now zoomed in on 😂. The clouds and sky is starting to look a lot better. I couldn't be bothered to post the devlog yesterday after a long coding session - sorry about that.

Update attachment

I got the stars and Shooting stars working, the stars even 'twinkle'. I was looking to get a cool water effect on the weather card but it still needs some work. I'm also trying to add a nav-bar, add a new tool (heater) and, finally fix the background😂.

Update attachment

Its starting to look a lot better!

The background still isn't great, it only looks half decent on full screen 😂 - but I've been *focusing on the other features like getting stars and the umbrella!

*I guess you could say procrastinating 😅

Update attachment

Uhh, it's not looking too great, but I think you can start to see the vision. I'm hoping the background with filters can match the weather.

Also, the initial background image was 32ish mb - no wonder it took soo long to push 😂.

The circle where the rain is absent is where my mouse was - the idea being you can interact with the rain/snow. I'm thinking of changing it to an umbrella so it also works with sun, letting you create a bit of shade as you move around, but let me fix the background first 😭.

Update attachment

I wasn’t able to record the time spent on the background, but it’s finally done! Now I’ll move on to implementing the features I mentioned in the previous devlog.

Update attachment

Currently I'm working on getting a background set up for the site. It's taking quite some time to remove the sky, but the idea is to have a nice background that reflects the weather in your area. I do want some cool effects like rain and snow and maybe even an 'umbrella' to make the site even more interactive!

I'll try finish the background today and then start trying to build the other features tomorrow!

So far the site works with it deployed on vercel - so the API key is hidden😅 - and I've got an 'animation' on it based on cursor movement.

Update attachment

First Devlog on my second project!

Built the barebones site, with the home page looking pretty bad. I didn't update the github yet cause uhh I don't want to leak the API key 😂lol. I probably should've sorted it out from the beginning but alas, I'll try sort out the Api key and upload to vercel and then update the site!

Update attachment