Introducing Twizzle (alpha)

[Lucas Garron]

So, it's been a while since I announced alg.cubing.net, and it hasn't changed much over the years. That's because I've been working from scratch with Tom Rokicki to build a much more powerful successor called Twizzle!

We have so much more to do, we not even in beta yet!
However, you can now start using it at:

https://alpha.twizzle.net/
​

Twizzle (short for "twisty puzzle") is an open source project based on a new library called cubing.js and its <twisty-player>, which allows us to support lots of new features:

All WCA puzzles and WCA notation	More & custom puzzles	Extended features
		Puzzle solvers
(Clock is currently 2D and doesn't show pins yet.)		Bluetooth and keyboard input (doesn't work well for all puzzles right now).
(Square-1 doesn't currently check that corners stay together and is only 2D so far.)	From Walter Randelshofer's Pretty Patterns database.	General puzzle format handling (using the KPuzzle format, based on KSolve).

So far we have an "editor" (similar to alg.cubing.net) and an "explorer", but we're working to combine those into a single app and have a few more experiments to bring in.
You can see the influence of alg.cubing.net, and also the rather general puzzle support, which is almost entirely thanks to Tom.

I've started a video series explaining Twizzle, and plan to cover new features as we work on them.
In particular, there are a few important open topics (notation, accessibility, etc.) where I want to reach out to the community before we go to beta and v1.0.

Twizzle Diaries — Ep. 1: What If?


Twizzle Diaries — Ep. 2: Ten Years Ago


Please try out Twizzle alpha and let us know what you think!
There are a lot of things we haven't gotten around to, and it would be useful to know what kind of functionality is valuable for you.

 

[LBr]

Bye Bye alg.cubing.net

 

[Deleted member 36445]

Congratulations Lucas, the app is beautiful and easy to use.
I'm looking forward to use it from now on.

Keep on the good work!

 

[Cubing Forever]

Wow that's nice!! Do you think it's possible/feasible to build a web-based Cube Explorer-like solver?

Edit: ACube.js exists wow!!

 

[OreKehStrah]

As someone who uses custom color schemes on all my cubes, would it be possible to add a color scheme customization option in the future? Obviously not necessary but would be a neat QoL feature!

 

[effperm]

yoooo this is actually awesome

 

[DuckubingCuber347]

O boy, I always wanted to solve a 40X40!!



But really, this looks awesome.

 

[qwr]

Since I learned basic js I can help contribute

 

[pjk]

Nice work @Lucas Garron. Just watched both videos, nice edits. I think making a video showing how to use Twizzle, why you should use it, why it's useful, etc. would be useful for new people to the community who aren't sure how it is used 1k times/day and would perhaps open their curiosity to it. Keep up the good work, hope all is well with you.

 

[BenChristman1]

It would be great if you could put the movecount of the solve (QTM, HTM, STM, etc.) into Twizzle, like it is in ACN.

 

[Christopher Mowla]

Will alg.cubing.net going to stay on the air even after a beta comes out, or do we have to update the links to all the algs in the wiki again?

 

[CodingCuber]

Did a CFOP example solve with this. The "Alg Tools" are really useful, especially the scramble tool. Found it really enjoyable to use.

Scramble: D2 F' B2 R' B' U' L B R F2 D2 B2 D B2 U F2 D' B2 U R2 U'

x2 R D L' U L' B F //cross
D2 R U' R' //F2L1
U' B2 R B2 R' //F2L2
U' L' U' L U2 L U' L' //F2L3
y L U' L' U2 L U' //F2L4
y' R U R' U' F' //OLL
y M2 U M U2 M' U M2 //PLL

 

[Megaminx lover]

alpha.twizzle.net dosen't work on my computer.

 

[Lucas Garron]

Wow that's nice!! Do you think it's possible/feasible to build a web-based Cube Explorer-like solver?

Edit: ACube.js exists wow!!

Yep!
Tom has been working on twsearch, which is a more powerful replacement for KSolve and ACube. The goal is to make that available on the web similar to ACube.js, and we're pretty close!

As someone who uses custom color schemes on all my cubes, would it be possible to add a color scheme customization option in the future?

Yeah, this is a top request. We need to think about it carefully, because people have a variety of color scheme needs:

• Colorblind folks who might have different needs for distinguishable colors.
• People who like to substitute an individual color vs. rearrange a bunch.
• Viewing algs with your preferred color scheme or LL face.
• Reconstructions of solves performed on some other color schemes (less of a problem now that most Japanese cubers use BOY).
• Reorienting the color scheme of a reconstruction to match your cross color.

... and then we need a way to handle this for all puzzles, and a way to "remember" such a setting for the right situation. I don't want to implement something super-customizable only for someone's "red" to mean someone else's "white".
I don't want to hold up 3x3x3 color schemes until we have a full solution, but I definitely want to get it right.

O boy, I always wanted to solve a 40X40!!

You wouldn't be the first!

https://experiments.cubing.net/cubing.js/stress-tests/40x40x40.html

Nice work @Lucas Garron. Just watched both videos, nice edits. I think making a video showing how to use Twizzle, why you should use it, why it's useful, etc. would be useful for new people to the community who aren't sure how it is used 1k times/day and would perhaps open their curiosity to it. Keep up the good work, hope all is well with you.

Thanks! First order of priority was just getting the site working and announced, but we're definitely working on a basic explainer vid. :-D

It would be great if you could put the movecount of the solve (QTM, HTM, STM, etc.) into Twizzle, like it is in ACN.

Thanks, it's good to hear requests like that!
It's definitely on the list. (For now, you can paste an alg back into alg.cubing.net to get counts, since the notation is compatible).

Will alg.cubing.net going to stay on the air even after a beta comes out, or do we have to update the links to all the algs in the wiki again?

I plan to redirect everything to twizzle.net eventually, but we will definitely make sure all existing links continue to lead somewhere that animates the same thing.
For now, it's probably best not to update any place with a lot of links.

alpha.twizzle.net dosen't work on my computer.

Hmm, it should work on any modern browser on any device. Could you try on a different network, or with another browser or device?

 

[abunickabhi]

Super excited for this project for over a year.

Was fun to follow your work Lucas. Twizzle will be super fun to use.

 

[Lucas Garron]

Since I learned basic js I can help contribute

Contributions are definitely welcome!
We rely on `npm` and GitHub. If you're familiar with those, it should be pretty straigthforward: https://github.com/cubing/cubing.js/blob/main/CONTRIBUTING.md

We have a few things marked as a "good first issue", although they tend to assume familiarity our tooling:

Build software better, together

GitHub is where people build software. More than 225 million people use GitHub to discover, fork, and contribute to over 800 million projects.

github.com

But it might be more effective to just start by tinkering with the code to see what changes.
(I want to make a proper "how to work with the code" video at some point. I have one draft, but it's very long.)

Feel free to join our Slack if you'd like to chat more directly about development!

Slack

join.slack.com

 

[CodingCuber]

Contributions are definitely welcome!
We rely on `npm` and GitHub. If you're familiar with those, it should be pretty straigthforward: https://github.com/cubing/cubing.js/blob/main/CONTRIBUTING.md

We have a few things marked as a "good first issue", although they tend to assume familiarity our tooling:

Build software better, together

GitHub is where people build software. More than 225 million people use GitHub to discover, fork, and contribute to over 800 million projects.

github.com

But it might be more effective to just start by tinkering with the code to see what changes.
(I want to make a proper "how to work with the code" video at some point. I have one draft, but it's very long.)

Feel free to join our Slack if you'd like to chat more directly about development!

Slack

join.slack.com

I'd love to help contribute. I'll try get around to it when I can.

 

[qwr]

Contributions are definitely welcome!
We rely on `npm` and GitHub. If you're familiar with those, it should be pretty straigthforward: https://github.com/cubing/cubing.js/blob/main/CONTRIBUTING.md

We have a few things marked as a "good first issue", although they tend to assume familiarity our tooling:

Build software better, together

GitHub is where people build software. More than 225 million people use GitHub to discover, fork, and contribute to over 800 million projects.

github.com

But it might be more effective to just start by tinkering with the code to see what changes.
(I want to make a proper "how to work with the code" video at some point. I have one draft, but it's very long.)

Feel free to join our Slack if you'd like to chat more directly about development!

Slack

join.slack.com

I use GitHub a lot, not really familiar with Node environment. I have taken a computer graphics course in C++ and worked with Plotly

 

[CodingCuber]

I use GitHub a lot, not really familiar with Node environment. I have taken a computer graphics course in C++ and worked with Plotly

Don't worry, Node.js is very simple to get started with. The documentation is straightforward too.

 

[Lucas Garron]

Don't worry, Node.js is very simple to get started with. The documentation is straightforward too.

`node` also has... a lot of compatibility challenges. I'm on macOS, so I personally would do this:

• Install Homebrew: https://brew.sh/
• `brew install node`
• Use the `cubing.js` development instructions: https://github.com/cubing/cubing.js#development

At that point, you should be edit the code for on any part of Twizzle and. Unfortunately, setting up `node` can vary a lot by computer. If anyone runs into issues setting up `node`, feel free to contact me directly and I'll try to help.

(Note: If you have access to GitHub Codespaces, that is much more convenient.)

If anyone is interested in trying out `cubing.js`, it's actually much easier to use a service like CodePen:

https://codepen.io/lgarron/pen/eYvrPrd

https://codepen.io/lgarron/pen/KKmMdzV

We have some documentation for `<twisty-player>` at https://js.cubing.net/cubing/ , although we could certainly use feedback on how to make it more useful.
I know this is all a bit vague, but we're still in the early days!