Coding Experiments: Difference between revisions
| (4 intermediate revisions by the same user not shown) | |||
| Line 41: | Line 41: | ||
* Can we modify the monkey butt so we see it from the side, and emphasize the tail more. | * Can we modify the monkey butt so we see it from the side, and emphasize the tail more. | ||
* When I first load the page, I'd like to just see the spinning coin taking up eighty percent of the screen width, and only when it has stopped should it shrink down and show the rest of the UI | * When I first load the page, I'd like to just see the spinning coin taking up eighty percent of the screen width, and only when it has stopped should it shrink down and show the rest of the UI | ||
| | |[[File:Random Robby 4.png|thumb]] | ||
|- | |||
|I don't like the new butt! Can we make it a simply 2-D rendition of the lower half of a monkey with a nice curling tail! Also let's make the overall design more coherent, by giving the background a jungle vibe | |||
|[[File:Random Robby 5.png|thumb]] | |||
|- | |||
|Finally, I prefer the original butt graphic. Can we revert to that? Also, I notice that on mobile, the collapsed settings panel covers the monkey in the logo. Can we put it in the right hand corner? Finally, coins and dice are too spaced out vertically when we have more than three. Let's limit vertical spacing to the same as the horizontal spacing. | |||
|[[File:Random Robby 6.png|thumb]] | |||
|- | |||
|Once the initial loading animation is complete, can we make the options button shake and glow for two seconds. Also, if the options panel is open, can we auto-close it when we click the "Flip/Roll" button. | |||
|https://adlington.fr/random-robby.html | |||
|} | |} | ||
== Contract Whist Scoreboard == | |||
This project is a bit more ambitious. | |||
=== Overview === | |||
*I want to provide a scoreboard for playing contract whist, a card game usually played with 3-5 people over ten rounds. | |||
*The scoreboard must be accessible from the web and optimized for iPad and for older people - big touch targets and clear readability | |||
*The game itself will be played in the real world - the web is just used for keeping score | |||
* Have a simple account system, where a user can add the names of their friends who they play with. | |||
* It should be easy for a user to get a game started quickly by selecting 2-6 players and generating a scoreboard for them. | |||
* A scoreboard consists of: | |||
** A column for each player with a heading of the player's name. The order of the columns is controlled by the order in which they are added to the game | |||
** By default there are ten rows (for ten rounds), but if there are more than five players, there are "52/players" rows. | |||
** Each player has three (unheaded) sub-columns - representing their bid, score, and running total for this round. | |||
** A far left column records the number of tricks in this round (starting at 10, and going down to 1), "roundTricks", along with the name of the dealer for that round. | |||
*A round consists of recording the bids of each player, then recording their scores and keeping a running total of their scores over the course of ten rounds. | |||
*After each round we will announce who is in the lead and the order of the other players | |||
*It should be possible to display statistics of the game in progress. | |||
*At the end of a game, we will announce the winner and the order of the other players and then save the finished game. A user should be able to look up all their previous games and obtain statistics for all the players associated with their account | |||
=== Record bids: === | |||
** The scoreboard must highlight the "bid" sub-column of the user after the dealer and provide a pop-over dialog with buttons from 0 to 10, with only the numbers from 0 to the number in the far left column enabled. | |||
** Touching a button adds the selected number into the player's "bid" column and then highlights the next player's "bid" column. | |||
** An "Undo" button allow the user to go back to the previous player's "bid" column and change the recorded bid. It must be possible to undo all recorded bids and scores up to the beginning of the game. | |||
** When recording the final player's bid, only valid bid numbers should be enabled. The final player's bid must not allow the total bids to be equal to the roundTricks. | |||
** Once the final player's bid is recorded, a popover dialog should appear announcing the total number of tricks bid in the form: "We've bid x out of y tricks. We're y-x over/under!." The dialog should close after 5 seconds. | |||
** The scoreboard must highlight the "score" sub-column of the user after the dealer and provide a pop-over dialog with buttons from 0 to 10, with only the numbers from 0 to the number in the far left column enabled. | |||
=== Record scores: === | |||
** The scoreboard must highlight the "score" sub-column of the user after the dealer and provide a pop-over dialog with buttons from 0 to 10, with only the numbers from 0 to the number in the far left column enabled. | |||
** Touching a button adds the following into the player's "score" and "running total" columns and then highlights the next player's "score" column. | |||
*** If the score is equal to the bid, enter the value of score+10 and add score+10 to the running total. The value in the "score" column should have a gold circle around it, and there should be a positive sound. | |||
*** If the score is not equal to the bid, enter the value of score and add score to the running total. There should be a humorous negative sound. | |||
** An "Undo" button allow the user to go back to the previous player's "score" column and change the recorded score. It must be possible to undo all recorded scores in this round, one by one, and then all recorded bids, one by one up to the beginning of the game. | |||
** It should be possible to calculate the final player's score as roundTricks minus all the previously recorded scores. When recording the final player's score, only valid score numbers should be enabled. | |||
** Once the final player's score is recorded, a popover dialog should appear showing a list of the players with their running totals ordered by running total descending. The dialog should have a "Close" button. | |||
** When the player clicks "Close", the scoreboard must highlight the "bid" sub-column of the user after the dealer in the next round. | |||
** | |||
=== End of the game === | |||
* When the final score of the final player in the final round has been completed: | |||
** a popover dialog should appear showing a list of the players with their running totals ordered by running total descending. The dialog should have a "Close" button. | |||
** Save the total game with a unique id, with the user's name and the datetime. It should be possible to | |||
Latest revision as of 08:44, 31 December 2025
Setup
This was surprisingly easy. I already had a personal github, but needed to install the iOS app. Once that was done, Claude Code walked me through linking to it. CC will create a branch and do its work, but then I need to manually create a PR to merge that branch to main. This is probably a good guardrail for real development work
Triangle Generator
I started in a very informal manner, getting CC to generate a random right angled triangle and to provide various information (angles, lengths, sin, cos, tan, etc) about it. Then, dictating additional prompts into my phone, I went through various iterations, adding additional triangle types (isosceles, equilateral, scalene), additional info (circumcenter, incenter, centroid, and orthocenter) and improving the UI. The appropriate display of angle and side names and values in the canvas area seemed to cause many issues, and in several iterations the display of the triangle was clearly incorrect, through calculated values seemed to be right.
Random Robby
This time, I'm going to be more formal, and spec out what I want and ask CC for a plan before building:
| Prompt | Output |
|---|---|
| I want to create a page to generate random outcomes. The screen should show a logo "Random Robby" and below it, five six-sided dice rolling for two seconds and then each settling randomly on one side. A button, "Go" should allow me to roll again. The user can choose to roll from one to five dice, and for the dice to have from two to ten sides. If two sides are chosen, then the animation should show coins flipping. It should be optimized for mobile. Make a plan to code this, giving justifications for technology and coding choices. | |
This is a good first version, but let's make some improvements:
|
|
Okay, this is a big improvement, but let's make some more adjustments:
|
|
I think we're pretty close now:
|
|
| I don't like the new butt! Can we make it a simply 2-D rendition of the lower half of a monkey with a nice curling tail! Also let's make the overall design more coherent, by giving the background a jungle vibe | |
| Finally, I prefer the original butt graphic. Can we revert to that? Also, I notice that on mobile, the collapsed settings panel covers the monkey in the logo. Can we put it in the right hand corner? Finally, coins and dice are too spaced out vertically when we have more than three. Let's limit vertical spacing to the same as the horizontal spacing. | |
| Once the initial loading animation is complete, can we make the options button shake and glow for two seconds. Also, if the options panel is open, can we auto-close it when we click the "Flip/Roll" button. | https://adlington.fr/random-robby.html |
Contract Whist Scoreboard
This project is a bit more ambitious.
Overview
- I want to provide a scoreboard for playing contract whist, a card game usually played with 3-5 people over ten rounds.
- The scoreboard must be accessible from the web and optimized for iPad and for older people - big touch targets and clear readability
- The game itself will be played in the real world - the web is just used for keeping score
- Have a simple account system, where a user can add the names of their friends who they play with.
- It should be easy for a user to get a game started quickly by selecting 2-6 players and generating a scoreboard for them.
- A scoreboard consists of:
- A column for each player with a heading of the player's name. The order of the columns is controlled by the order in which they are added to the game
- By default there are ten rows (for ten rounds), but if there are more than five players, there are "52/players" rows.
- Each player has three (unheaded) sub-columns - representing their bid, score, and running total for this round.
- A far left column records the number of tricks in this round (starting at 10, and going down to 1), "roundTricks", along with the name of the dealer for that round.
- A round consists of recording the bids of each player, then recording their scores and keeping a running total of their scores over the course of ten rounds.
- After each round we will announce who is in the lead and the order of the other players
- It should be possible to display statistics of the game in progress.
- At the end of a game, we will announce the winner and the order of the other players and then save the finished game. A user should be able to look up all their previous games and obtain statistics for all the players associated with their account
Record bids:
- The scoreboard must highlight the "bid" sub-column of the user after the dealer and provide a pop-over dialog with buttons from 0 to 10, with only the numbers from 0 to the number in the far left column enabled.
- Touching a button adds the selected number into the player's "bid" column and then highlights the next player's "bid" column.
- An "Undo" button allow the user to go back to the previous player's "bid" column and change the recorded bid. It must be possible to undo all recorded bids and scores up to the beginning of the game.
- When recording the final player's bid, only valid bid numbers should be enabled. The final player's bid must not allow the total bids to be equal to the roundTricks.
- Once the final player's bid is recorded, a popover dialog should appear announcing the total number of tricks bid in the form: "We've bid x out of y tricks. We're y-x over/under!." The dialog should close after 5 seconds.
- The scoreboard must highlight the "score" sub-column of the user after the dealer and provide a pop-over dialog with buttons from 0 to 10, with only the numbers from 0 to the number in the far left column enabled.
Record scores:
- The scoreboard must highlight the "score" sub-column of the user after the dealer and provide a pop-over dialog with buttons from 0 to 10, with only the numbers from 0 to the number in the far left column enabled.
- Touching a button adds the following into the player's "score" and "running total" columns and then highlights the next player's "score" column.
- If the score is equal to the bid, enter the value of score+10 and add score+10 to the running total. The value in the "score" column should have a gold circle around it, and there should be a positive sound.
- If the score is not equal to the bid, enter the value of score and add score to the running total. There should be a humorous negative sound.
- An "Undo" button allow the user to go back to the previous player's "score" column and change the recorded score. It must be possible to undo all recorded scores in this round, one by one, and then all recorded bids, one by one up to the beginning of the game.
- It should be possible to calculate the final player's score as roundTricks minus all the previously recorded scores. When recording the final player's score, only valid score numbers should be enabled.
- Once the final player's score is recorded, a popover dialog should appear showing a list of the players with their running totals ordered by running total descending. The dialog should have a "Close" button.
- When the player clicks "Close", the scoreboard must highlight the "bid" sub-column of the user after the dealer in the next round.
End of the game
- When the final score of the final player in the final round has been completed:
- a popover dialog should appear showing a list of the players with their running totals ordered by running total descending. The dialog should have a "Close" button.
- Save the total game with a unique id, with the user's name and the datetime. It should be possible to





