phetsims / buoyancy

"Buoyancy" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
2 stars 2 forks source link

New Screen: Lab #113

Closed DianaTavares closed 1 month ago

DianaTavares commented 2 months ago

This new screen goes between Explore and Shapes.

This is its initial state: image

Fluid displaced When "Fluid displaced" is selected, a beaker panel will appear in the position shown in the next picture (between the forces panel and the ground: image

I want the panel to have the same color that the other panels, but the scale color needs to be darker. I couldn't do that in the mock-up, but I hope you can be in the code.

The fluid pool volume is 100L, then the beaker will fill with fluid with the operation: the value of fluid pool volume — 100L. The max volume of the breaker is 10L, and then it has tick marks every 1 L, with a bigger tick mark in 5 and 10L. The color of the fluid inside needs to match the fluid in the pool.

Sale in the fluid The scale can move only in the vertical direction with a control like a slider image

The movement goes from the bottom, to the surface (it can't go out of the pool or affect the Fluid displaced measurement) image

% submerged panel When % submerged (#112 ) is active, the panel will be placed in the bottom of the density panel: image

Scale on the ground make it unmovable. We don't want that users move in the pool.

Icon This is the icon, but I hope that by drawing it with code looks much better! Use the same scale that the screens, only showing N (units).

image

zepumph commented 2 months ago

Scaffolding committed. Right now it is a direct copy of Applications.

zepumph commented 2 months ago
zepumph commented 2 months ago
zepumph commented 2 months ago

Lots of work still to do here, but I made a commit for the displaced fluid panel (currently invisible). I'll get back to things tomorrow.

zepumph commented 2 months ago

Good progress here today, but definitely not done here, but here is the current fluid displaced panel:

image

More to be done next week. (including 4 TODOs)

zepumph commented 1 month ago

Making progress: image

zepumph commented 1 month ago

I finished the design of the fluid displaced panel, and created https://github.com/phetsims/buoyancy/issues/129 for @DianaTavares to look at. I'll continue on with other items here.

zepumph commented 1 month ago

Hey @DianaTavares! @samreid and I believe that this issue is ready for review. Almost everything has been implemented, and remaining work is over in side issues:

Sticky scale component (totally not working right now): https://github.com/phetsims/density-buoyancy-common/issues/107 Screen icon: https://github.com/phetsims/buoyancy/issues/48

Can you take a look at the screen and let me know if there is anything you'd like changed? The only main difference from the mockup is that there is no "A" label, since there isn't a "B" block to add in.

DianaTavares commented 1 month ago

It is amazing!! in the last design meeting, we agreed to change the "gravity control" to a new place, but I created an issue with those changes in #133 image

Then we can close this issue. Thanks!!