Designing a GUI using Gradio

[vandrw]

I have briefly used Gradio before and could have an attempt at designing a frontend for the project. However, before starting, I wanted to discuss how much feature parity we could achieve with DeepMind's AlphaFold server.

Currently, their implementation supports taking as input sequences/fastas of proteins, DNA, RNA, ligands and ions. Should I keep anything in mind while trying to replicate the following in Gradio? I will definitely be coming back with more questions regarding the output of the model, but for now I will try to implement the basic elements.

[amorehead]

I love the initiative here! Thanks for kicking this off. I think Phil will have more thoughts on the web UI

[Poko18]

If it helps, here is already a similar implementation in gradio for RFAA.

[lucidrains]

@vandrw hey Andrei! i think we should just try to use gradio as much as possible

i'm sure there are limitations however, and we can always go for a more complete UI sans gradio at a later date, and only if we figure out some missing UI component has a big enough value add (i was a fullstack developer prior to the AI thing, so doing this is pretty trivial but time consuming)

for starters, i think just having a multi-input form for the various bio sequences + rendering the pdb and associated confidence heatmaps is good enough?

[vandrw]

@lucidrains Hi! Thanks for looking into this! I'm not worried about the graphical elements, but I was merely wondering if there are certain things we don't plan to support. I am still quite inexperienced with the AlphaFold model input and output that you have coded, and when I wrote this issue, I didn't look too closely at the Alphafold3Input class. However, after having a closer look, it seems I answered my own question 😄

I will start working on this once I manage to debug the template unit vector code!

[lucidrains]

@vandrw yup exactly! Alphafold3Input should be intuitive enough, if i designed it well

we will also need a few tests to ensure that the same PDBInput and Alphafold3Input converges to the same AtomInput representation. Alex and I kind of just worked off different input pipelines to parallelize work

re: plan to support - i haven't actually played around with their UI yet, so you'll have to let me know which things you are referring to

[lucidrains]

@vandrw would say, if you haven't developed an app before, just focus on single string input protein sequence -> 3d atomic positions -> pdb -> rendering with 3dmol + gradio or whatever lib is popular these days. then we can slowly work our way up to a more complex form for multichain + nucleic acids + ions

[vandrw]

re: plan to support - i haven't actually played around with their UI yet, so you'll have to let me know which things you are referring to

@lucidrains I was jumping the gun a bit here, but for example, the AlphaFold Server supports glycosylated proteins. According to their FAQ:

The Server supports the following glycan residues to be attached to a protein residue

• N (Asparagine): BGC, BMA, GLC, MAN, NAG
• T (Threonine): BGC, BMA, FUC, GLC, MAN, NAG
• S (Serine): BGC, BMA, FUC, GLC, MAN, NAG

The Server assumes that glycosidic bonds are formed between atoms at positions that have the highest frequency of occurrence in similar bonds from the PDB - this might lead to different bond positions in the modeled structure than expected. Specifying exact atoms for the glycosidic bond is not currently supported.

I was wondering if we need to perform any additional checks for such inputs. However, as I mentioned, I'm probably a bit ahead of myself here. This can be addressed once we have an initial version :)

Regarding my experience with app development, I've done some work in this area before. I can definitely use custom JS if the basic gradio capabilities are lacking. I will see how far I go with this! Thank you very much for your suggestions 😄

[lucidrains]

@vandrw let's definitely save modified biomolecules for last, as there is a lot of complexity there (which is mainly reflective of molecular biology in general)

i also don't have an interface for modified biomolecules in Alphafold3Input just yet, but will get that done by month's end

[lucidrains]

@vandrw put down some basic scaffold here

eventually end researcher will just do alphafold3_pytorch_app --checkpoint ./path/to/alphafold3.pt

[Hanziwww]

Hi, I developved an Alphafold3 GUI. Project url: https://github.com/Hanziwww/AlphaFold3-GUI. Demo site (generate input JSON files ONLY)

[lucidrains]

@Hanziwww very cool! keep up the great work!

[Hanziwww]

@lucidrains Thanks. Now I released a new version with visualization.

1. Visualization Module

2. Visualization GUI Interface

3. Online Usability

• To make this even more accessible, I have deployed an online app where users can upload their AlphaFold3 result files and visualize them in real time.
• This app is fully functional and available at the following link: Usable visualization site (fully usable)