New lab data browser for Eterna Medicine

  • 4
  • Article
  • Updated 3 years ago
As one part of the transformation to Eterna Medicine, I am going to be working with the dev team to create a brand new official lab data browser.  Hopefully it will incorporate the best ideas of both the long time Flash-based browser and the newer, but less used, HTML browser, as well as player-created tools based on Google spreadsheets, fusion tables and R.

I think we have a very good chance of making a much improved browser because there is now so much more overlap, and hence better communication, between the players and the devs.  To further this, I would like to give all interested players a stake in the creation of the new browser, even before coding starts.

With that in mind, here are two Google documents that I am making public.
  1. Eterna Medicine Data Browser Notes - These are basically thoughts that I have gathered over the last month or so, since I started thinking about what the browser could be.  You'll see notes and conversations from Eli, whom I engaged early.  But now I would like to open up the process to all players.
  2. Eterna Medicine Data Browser (Layout) - This is a more concrete representation of how I envision the browser being laid out, as I think this is fundamental to its utility.  I just finished this set of slides yesterday and showed it to the dev team.  Their response was very favorable, and they had some good suggestions for making it even better.  Now its your turn.
Both these documents are works in progress, to be updated as we progress.  The immediate issue I have before me is a challenge from Rhiju -- how can we use the data browser to help bridge the gap between Eterna as game and Eterna as science?  But you're welcome to comment on whatever issues you think are important to discuss while we're still early in the design cycle.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes

Posted 4 years ago

  • 4
Photo of Brourd

Brourd

  • 437 Posts
  • 79 Reply Likes
This is quite the ambitious undertaking. An interface with the data analysis capabilities of a basic spreadsheet program along with a flexible GUI and API to allow players the ability to modify and alter the browser with additional tools and code for whatever function they need.

While complexity such as this is not unheard of in games today (some games may require the juggling of dozens of statistics for high level play), it's not friendly to the average individual. To add on to that, the gaming aspect of Eterna is simplistic in form and function.

The player experience is to place base pairs in a predefined secondary structure in order to design a sequence that folds into that structure. Higher level play consists of an understanding of how certain mutations may alter the predicted free energy values of a sequence's target and resulting native fold prediction. Nowhere are players expected to want or need to analyze hundreds of attributes in order to "win."

So rather than making the current UI and feature set more complex, you should be looking at methods to simplify it. How can we provide the most concise presentation of the data in a visual format that would allow anyone to make an observation about a sequence and result?

The original flash browser and results view was a prime example of this done right. Instead of providing players with an insane amount of information in a series of adjustable columns and functions that had every experimentally determined SHAPE value available, along with error rates and information about the normalization schemes, it gave a results view with each base containing that individual information. As players requested more functions, the browser/results view became more complex.

Now, that's not to say that a more complex browser is not necessary, but perhaps that should be made available in another format, such as a downloadable piece of software, along with regular data/function updates.
Photo of Brourd

Brourd

  • 437 Posts
  • 79 Reply Likes
So the aim of this is NOT a design browser (which is what the Flash and HTML browser are for, with some minor statistic sorting capabilities), but rather the creation of an official web-based data analysis application, wherein one can garner general statistics about collections of designs specified by the player using any number of defined sorting constraints, connected to all 70,000+ sequences and hundreds of attributes? In addition to this, the analysis app would also include software for other functions that are deemed useful, which are perhaps required to be open in other tabs or windows?
Photo of Brourd

Brourd

  • 437 Posts
  • 79 Reply Likes
And the aim isn't to replace any of the existing browsers, which would remain as they are? Does this mean that the barrier of entry to lab analysis will be made even greater (and not smaller), by the inclusion of a web-based analysis application with limitless capabilities that players would be redirected to?
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Yes, its purpose is to allow players to make better sense of the deluge of lab data (hundreds of thousands of designs, hundreds of attributes in the very near term), not to create new designs, and it won't be replacing anything.  But when I say analysis, I'm not thinking so much about complex statistical analysis.  Rather, the initial focus is going to be to make all the lab data accessible to players within Eterna (i.e. not requiring Google sheets or fusion tables) and do so in a way that makes the most sense to players (e.g. only download and display the small subset of data the player has indicated an interest in).  As an example, currently there is no decent way to compare Exclusion 3 puzzles across all synthesis rounds, even though that is obviously a desirable thing to do.

Re your question "...the analysis app would also include software for other functions that are deemed useful, which are perhaps required to be open in other tabs or window.", we want to have a plan for how that could be done, but it is not anywhere near the top of the priority list.  Much more important is to bring the functionality players most want into the browser, to reduce the need for multiple independent browser windows and applications.

As for the possibility of raising the barrier of entry to lab analysis, if that happens, I would say we'll have done a bad job of designing the browser.
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Comment back on this bit:

"As an example, currently there is no decent way to compare Exclusion 3 puzzles across all synthesis rounds, even though that is obviously a desirable thing to do."

I would really love that option. As is I'm regularly sitting with two windows open beside each other with two different rounds of the same lab. Which can get messy as I also want to consult the spreadsheet. Plus when rounds are together, we get the strength of using the sorting function on all the rounds data at once. We get the power to find sibling designs with no round border.

Photo of Brourd

Brourd

  • 437 Posts
  • 79 Reply Likes
I understand full well the draw of grouping all data into an easily accessible database. Indeed, it will be possible to make comparisons between designs located in various rounds under many possible names. It will also be possible to make individual comparisons between designs, and with a decent number of sorting options, be possible to measure the similarity between designs. However, an individual could do all these things in a spreadsheet program or Fusion table, no? The aim of this is not so much to make this data accessible, as it is to collect everything into a single database to make queries from, without the additional work involved for the player.

I'll say right now that this is not a bad thing, but it doesn't alter the player experience. The complexity and understanding necessary for basic statistical analysis remains the same, and the main individuals who will benefit from this will be those who would already do all of the work necessary to collate this data.

As an example, Eli could create a Google fusion table with every Exclusion 3 design within it, a fusion table for Exclusion 4, and so on and so forth.

My support for any new database browser will stem primarily from the attempt to simplify the data to the point that any individual can draw a conclusion from the result displayed, which would include both quantitative results and basic qualitative results. The more complex functions and queries will still exist, of course, but they would only be available for those who search them out, and not as the default state.
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Some feedback on the Eterna Medicine Data Browser (Layout) document


My immediate reaction is that it looks clean and well thought through.

On slide 6 I have a comment. I hope we are going to keep the column filtering right above the columns.

Column filters
 


The strength of working this way, is that I can directly see the effect of the columns I change and quickly change it, right on top of the column I'm adjusting. Having to open the side view for filtering will add an extra step + it will leave less space for the columns. I typically decide on what limits to set, based on watching the data directly. If the process is split from the action, it will not be as intuitive. It will feel more separated from the data. I like that I can see the direct action. With my eyes on both changing the numbers and the column where the changes happen.

Cut out from slide 6:
   

 

Comment on slide 8 (Display panels only when needed)

I very much like that. It works really well in fusion tables. I use it a lot, to get better space for Eterna and not showing my filtering criteria when not needed.

Panel sharing. Looks neat.


Alternative views

By the way, I noticed that design view and MS2 graph are under different sub headers. Mostly this is good, but I suspect that some will want them at the same time. I guess that can be done by how sliding the sides, with what you have already. So just a note. By the way, I think people may also want melt and dot plot like this. Perhaps under a sub header too? The melt and dot plot easy get in the way of the design when in same screen image.

Basically I expect that some will want to clone that window, to have some of its parts beside each other.

Did a couple of mock ups of what I can imagine people want to try out. I would find it useful, despite I'm not using the graphs much. But when I do, I like them to be present beside the design.   





Ok, feedback over. :)
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Thanks, Eli, for reposting your email here.  I presume you didn't include my replay simply because you didn't want to assume I wouldn't want it posted without my permission.  But no problem.  Here it is in full.

Thank you very much, Eli.  These are all things I have thought about, but that doesn't mean I've come to the right answer.  Which is exactly why I wanted to open the discussion up to players early in the design process.

Mobile devices: The dev team agreed that we shouldn't hobble the browser to work well with mobile devices.  On the other hand, they didn't want to write off the consideration of mobile entirely.  We had some discussion about what that might mean.  The best idea that came up was for a smaller screen, only show one panel at a time; the player would have a keystroke or touch gesture to switch between panels.  That shouldn't be too hard to implement, but it won't be a priority.

Column filters: I had actually come to the conclusion that separating the filtering (a la fusion tables) was an improvement.  My main reason for thinking that is that I'm often setting a filter on columns where I am not really interested in what the values are, as long as I know they lie within the range I'm looking for.  The best example would be the fold change error factor.  I hardly ever care what its actual value is, so its column is normally way off the screen to the right. It would be a real pain to have to scroll the whole table looking for it, just so I could set limits on it.  

A second, lesser, advantage is that the sliding panel gives me the choice of freeing up screen space to see more columns, while the selection boxes as implemented in the Flash browser always take up the space of 2-3 rows.

And finally, I envision additional options for filtering, beyond range.  For example, when filtering on the base sequence, we want the option of finding matches either only in a given range, or anywhere in the design.  And we want a choice between exact matching and approximate matching.  I don't see that working so well in the old style.

But having said that, there is no reason for saying that there needs to be only one way to do something.  If it turns out that the best solution is being able to filter in either of two panels, with the two panels being synchronized at each keystroke, we can do that.

Multiple detail panels: I agree.

Dot and Melt plots:  As they are implemented now, these are less useful for switches because they don't really reflect anything about the RNA except how it folds in the absence of any ligands.  And I'm not sure if there are even existing algorithms for estimating the wide range of ligands we're going to be looking at.  (Oh that reminds me - Rhiju said Eterna Medicine won't be limited to miRNA inputs and outputs, contrary to what I had gathered.)  So for now, at least, I'm thinking of them as being a possible future enhancement.  But at least we have a plan for how they could be handled -- as another tab in the detail view -- once we figure out how to create them.

Keep the thoughts coming as we proceed.  But unless you have something you want to keep private, why don't you post them in the forum thread, to encourage other players to be thinking about it, too.
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Thx for the comments!

A few more back.

On the melt and dot plot, it is no big priority for me. What we got works for now.

A few more arguments for the column filters on top on the columns.

For sequence search it is really important to have the search field on top of the columns as I often use the sequences in the sequence view list to decide what to limit to.

I like your thought on saving lines for viewing more data. If the search field fills less, it will only be a bonus. I think the web version did that.

Also I use these column fields to sort the data directly. I won't have to reverse score order in another window - I'm regularly watching the data from the upside down, starting with the bad designs. :)

My main point though is that I'm often resetting the filtering options during my analysis. So sorting directly over the column I'm watching, I can work directly with the data where I'm at.

I sometimes use the filtering boxes for screenshots along with the sequences when I share data analysis. So people can see what filters I set.

Some values I like fixed filtering for. Eg for things like cluster counts and error rate. Those I need not touch often, but would love to have globally assigned no matter what lab I enter. (Where they are relevant) But other filter values I wish to adjust depending on the lab I am in and even change in a specific lab several times as I change focus along as I analyse the data.

So perhaps some global filtering versus some local, in sequence view list filtering?
Photo of Brourd

Brourd

  • 437 Posts
  • 79 Reply Likes
Here is a question based upon Eli's comment of "global v local." How will the database browser be accessed? Will each individual lab have a link to the browser with only its designs loaded, or would one need to access the browser and then filter out the lab puzzle in question?
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
We're making up the plan right here and now, and it's not a question I had asked myself yet. How do you think it should work?
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
I realized that the two posts I put up today were really just an attempt to give some inputs on the challenge that Omei passed on in this post, about what can help bridge the gap between Eterna as a game (puzzles) and Eterna as a science (lab). So adding the links here.

Getting us ready for the Medicine labs
Getting us ready for the Medicine labs 2
(Edited)
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Getting players ready for the lab

One thing that I think will help immensely with getting newer players and players in general better prepared for the labs labs, is to put more weight on switch puzzles. I have already gone into more detail on how and why:

Mission Switch Badges
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Siqi Tian (a graduate student in Rhiju's lab) spent an intensive two weeks of implementation work and we now having something you can try out.  

The one thing that may not be immediately clear is how to control the left and right slide-out panels.



The panels can be popped out using the gray bar at the edge of the browser window.  (It will turn turn a pale orange when the mouse moves over it.)  If you click on the center section, which is a brighter orange, the panel will pop out and stay there until you pop it back in.  if you click anywhere else, the panel will pop out and stay as long as the mouse stays in the panel, but will automatically pop back when the mouse leaves the panel.  Once out, the panel can be resized by dragging the bar.

This is what I would call a "beta preview" release.  There is a lot of work still to do, and you don't need to report specific bugs (unless you want to.)  The main reasons of putting up such an early release is to get player feedback now, before we have invested so much effort that is hard to re-think fundamentals.  With that in mind, I would be particularly interested in:
  • What things do you really like, and don't want to go away, as we refine the browser?
  • What things do you not like, and hope will go away?
  • What changes, or additional features, do you really want?  I'm particularly interested in the question "What changes/additions would be necessary for this to become your primary way of looking at new lab data?"
As a reminder, in the foreseeable future, this browser will be in addition to, not instead of, the two data browsers that are already in the game.  Its immediate purpose is to support better analysis of the synthesis data from Johan's lab-on-a-chip experiments.

I'd like to give a big round of applause to Siqi.  His Eterna name is tian47.
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Hi Omei and Siqi!

A few thoughts back on the new browser.

I really like that all the columns from the fusion table are there. It looks like you guys are running it from a fusion table. :)

I also very much like the color for the base numbers, etc. Thx, Siqi! :)
 


I also like that some of the columns have gotten colors. Which means there is now a visual connection between some of the columns that I have trouble with determining what to use for.



I love that I can pick related labs and mix them. One thing that is a bit confusing, is that there is almost too much info. I don't need lab numbers, just lab name. I like the round thing, though. :)



I will rather that labs fill a bit less, just like the fusion tables. Like a simpler show. As long as there is a way to get that info somewhere else, I will like it go be hidden as it mostly won't be needed. Like below:


 

One thing that would be helpful, would be to be able to choose to see design and that graph thing at once.

 
 
One thing that I miss real big time, is the input boxes on top of the columns. To be able to putting in numbers and being able to adjust them on the go, and not having to adjust somewhere else to get to them. Each time I have to, is extra clicking and it breaks the flow. Having the column boxes is simply a far more flexible way of working.



Without the input boxes, I can't search for Designer either. I often search for designers that I know do well to study their designs in particular.

However I love if the input boxes are a way of setting a global preference.

Also the number input boxes fill a lot more than in both Eterna classic and the HTML version. And since we now got a lot more columns, this means more boxes and a whole lot more of scrolling.

Data Browser


HTML


Eterna Classic


Wishing you guys luck. You have gotten quite a bit done in a rather short time. This is already a far more interesting looking fusion table. :)

Eli



Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
I like that mockup.  There's really no need to have "search:" in every little box.

Also, we're planning on replacing the None/Asc/Desc box with the double arrow icons from the column headings.  That will free up more space, too.
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Siqi alerted me to that the filter now updated:

Eli: Filter inputs are now in-line with column names in draggable blocks in left-panel of new browser demo: http://104.156.231.92

This is awesome! Big thx!

New view


I see that the labs selection is also simplified but unfolds with the extra details and numbers, when hovered over.

Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
*Tiny* nitpick. With the new hovering, when you go from bottom to top, it flickers a little due to the space that does not have a rollover.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
This comes from a generic feature, where things that don't fit into their default box expand when the mouse passes over.  You can see it in action for long design names, and it is very useful for displaying the design descriptions which currently only appear in http://104.156.231.92/old.)

Do you have a suggest for refining it?
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
Yeah. I'd make the rollover occur on a div that includes the whitespace, straddling it like this:
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Multiple selection

Something else new in this browser that might not be obvious:  you can select multiple designs, and each selected design will appear in the right panel, in the same order:

                  

To select multiple designs, you can use either Ctrl/Command click (to add or remove a single design) or Shift Click (to select all the designs in a range.)
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Thx for the image. I like this. :)

First two design I clicked to compare in the Exclusion 2 lab after setting cluster count limits, just happened to be two of my designs, one with MS2 gate and the other without. The one without scored highest.

I'm looking very much forward to the sorting function, as this is where I think this new option of comparing different designs, are going to show its full strength.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Drag and drop column reordering

Also, you can reorder columns by dragging in the main display (in addition to the left panel). Currently, this only works with the top line of the column headings

Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
Ok, I'm just going to throw out some initial feedback. I know that this is still a bit early, but I'll go ahead and mention my thoughts if it's of any help. I'm really excited to see this, and there are some really great things in here. Most of my comments are looking at how to keep things a little bit more compact and refined, as there's a lot there (which is great!) and it can be hard to parse through everything that is there.

  • It feels like there's an excessive amount of space in the header. Could this be trimmed down?

  • I'd like to be able to resize the column width. Some fields might want some extra readability, or others like this one I could stand to trim down to conserve space:

  • I personally have a little difficulty getting past the style and color shift of the added buttons. I find even just a quick hack of removing the gradients and making the background the same as the other buttons more comfortable:

  • I'd like to see the scroll pane inside a scroll pane removed. Just keep the buttons persistent across the bottom (or top, as the case may be-I'd just stay consistent).
     
  • I agree with the column options needing to be a bit more compact, but one thing I think would really help is if they could be categorized. This way, even if just the nucleotide/pair counts and percentages were in their own section, it dramatically reduces the list size, and enables a much quicker process of finding what you're looking for and what's available. In addition to this, because there are so many columns, I might also suggest adding a dynamic search bar, so as you type it in, you can just click on the suggested column info and it will bring that up directly. There could be two separate sections, a static one with the collections & search bar, and a second that has all of the active filters/info that will scroll (see my last point).
  • If you could, set collapsible to be on for the accordions, I find myself trying to do that and can't.
  • Could only a limited amount of designs be loaded at a time? Loading everything makes the interface quite slow to scroll, and it could be paginated, have a "load more" button, have an option for how many to display at once, etc. I was thinking about this for the regular browser too.
  • Perhaps add a little info on the columns on hover, or even better include a little question mark icon to click on or hover over (either on the column headings or in the selection panel).
  • Might want to add the project round if that's ever used again, I know it has been in some older puzzles.
  • Eventually, custom scroll bars like those in the web interface? Maybe? :)

Also, I a couple questions about the data itself.

What is the structure that's presented? I can tell it's not the default target structure (they're all different), and I'd assume it's not predicted fold (we're not using SHAPE). Is it the structure given by the energy model it was submitted with? I would personally like to have access to all of the things I've mentioned, though I assume that may be an issue of lack of data available from EteRNA. Also, what about free energy and melting point (for the various engines, as mentioned before)?

Will we be able to query this from scripts, and if so, when will we get at least the basic info for how to access? I could go figure it out, but it would be preferable to just have some basic documentation. Will all of the EteRNA data (not just switch cloud labs) be able to to be accessed through the same API (IE as opposed to fusion AND EteRNA's internal API)? It would keep things a lot simpler, and there is some data here that could be useful for the other puzzles as well.


Thank you SO much for your work, I'm really excited to be able to work with this as it moves forward!
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Thank you, LFP6, for taking the time to record your thoughts!

By and large, I simply agree with you, and will plan on addressing your concerns.  I'll just explicitly comment when there is something more to say.

Re scroll bars within scroll bars, it's definitely a no-no.  Siqi noticed and fixed some of the instances, and we will fix the rest by removing the outer scrollbar  I also want to move the inner scrollbars we've left out to the border and stylized so that they look like the other scrollbars:


Re long lists in the left panel, we definitely will need something more than one long list.  The top two accordions will actually be the place where the longest lists will be. We have more behind-the-scenes work to do before we're ready to really tackle that issue, but I'll plan on discussing it here before I spend a lot of implementation effort.

Re the accordion behavior, this is the default behavior of the layout framework I chose.  My first impression was similar to yours, but I've come to appreciate it because it actually saves clicks over manually collapsing and expanding each section independently.  Live with for awhile, and if you still don't like it, feel free to raise the issue again.

"Could only a limited amount of designs be loaded at a time".  Absolutely.  Here's a document that records my thoughts on the database and query design for the browser.   It's not totally up to date, but I think it is good enough that you can understand the intent.  Feel free to comment, either here or in the document itself.

As to the structures in the right pane, it is the predicted fold for each of the two states. Right now, it's using the structures that Meechl added to Johan's spreadsheet.  The near term plan is to calculate it on the fly using Nando's flash-based code.  (We're not using any flash in the UI, but for now, that's our only real choice for estimating foldings across all the various labs.) 

FWIW, the current implementation of the structures tab is rudimentary.  I expect it to get fleshed out quite a bit, and be interactive.  For example, I want to be able to mark one or more bases, and have the same bases marked in all the selected designs, both in the main list display and in other designs in the right panel.

As for free energy, melting point and the graphs that go with them, that's unclear to me at this point, given the different energy models we're dealing with.  I'm just going to postpone thinking about those.

As to the API, it will be public and documented (although I may try to lean on you for help there.)  I also hope we will support either JSONP or CORS, so that player-written tools don't have to be hosted on an Eterna server.  But that's outside anything I have direct control over.

Hope that, combined with todays player/dev chat, is responsive to this round of questions.

BTW, don't expect any major updates to the demo this week.  Siqi has handed it over to me for now, and I'll be focusing on pinning down the specifics of the database structure and API.
(Edited)
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
Great on the scroll bars, looks nice!

For the accordion, assuming you're using jquery, if you turn it on it will still auto-collapse if you click another item. In fact, I don't see a way to turn this feature off.

Thanks for the doc link, I will take a read a bit later. Limited loading would be good so there isn't so much lag.

To the structures and such, I think having access to all would be good, but for scripting purposes I just realized that with EteRNAScript it doesn't matter, as that data would be calculated, not sent from the API, so that's another unrelated issue entirely! Cool to the interactivity bit.

Would be happy to give a hand with documenting the API. Was hoping to eventually doing that with the EteRNA web one anyhow at some point. Outside access would be nice, I did notice it seems the RMDB will eventually have one with the info currently in the web interface but this data isn't in there.

Great to see some really good work being done!
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
Looking for clarification on two of the fields for the first query:

Does puzzle type tell you if it's a single state, standard switch, olgio switch, design-your-own, etc?

Does data type look at SHAPE vs MS2, etc?
Photo of t47

t47

  • 1 Post
  • 0 Reply Likes
Some quick response:

- We focused mainly on functionality for the prototype. So we did not spend much time to style it up. That's why the side-panels appears "ugly" and non-optimized much for display. That will be touched for future refinement, including "hover description" etc.

- We will consolidate the "display option blocks" into single line (in-line text inputs), as Eli and LFP6 both suggested.

- There is a link http://104.156.231.92/old  that is a retrofit to the "old/existing" lab browser with previous (pre switch era) lab data. Same JS library shared, only differs in custom column meta.

- Unfortunately, resizing column width is  a luxury of the DataTable plug-in in use. No official support yet. But I agree we should not leave large areas blank.

- Small screen does not work well with the current prototype, due to the nature of large tables and side panels. Zoom-out in the browser would help a bit, but it's known that tablet and IE will still suffer.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Getting 2D structures into the new browser

Nando has demonstrated for me a minor tweak to the flash app that makes it very suitable for displaying 2D structures in the new data browser.  But I can think of two different ways to to that, and I would appreciate some input from players before I proceed.

From early on, my intent has been to display the structures in the right panel, like this:


I think this works well with the rest of the new UI.

But in the legacy browser, comparison of structures is done differently -- you set the selection and ordering of designs in the list view and then switch to the 2D structure view.  There, you only see one design at a time, but can switch between designs with the U and D keys.

This specific feature of the legacy browser has been very powerful, and experienced players have come to love it, so I don't want to replace it with something new without giving other players a voice. With the tweaked flash app, I should be able to emulate the old behavior by opening up a new "window" (either an overlay in the main browser tab or in a separate browser window).  But both of those comes with disadvantages.

Which would you rather see?
Photo of JR

JR

  • 240 Posts
  • 20 Reply Likes
Can you go to the legacy view which is the design view I believe from the right panel view?
That might be the best of all worlds.
Are the highlighted in the left panel shown in the right panel as a scroll list?
Doing a great job by the way.
Photo of JR

JR

  • 240 Posts
  • 20 Reply Likes
May be jumping the gun here but access to the third right panel could be a button to
top right hand side with the rest of the buttons so you can toggle and bring up and down the highlighted list in the middle panel in the third panel?
(Edited)
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
I'm not sure that I understand correctly.  You are suggesting a labelled button that has the same effect as clicking on the blue "handle" of the right panel?
I certainly agree it isn't great as it stands now; it's simply the default behavior of the layout library I chose.
Photo of JR

JR

  • 240 Posts
  • 20 Reply Likes
The blue handle is fine. I just did not see it. Thanks.
Photo of JR

JR

  • 240 Posts
  • 20 Reply Likes
Very nice. Are we going to be able to drop into the old detail screen so we can play around with the design? Before you go any further I would walk Eli through the screens, I would call him the power user of the bunch and would feel comfortable
with his direction.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Don't worry; Eli's been a (quiet) partner in the data browser development from the very beginning.
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
When looking at the details of a selected solution, there are a lot of fields that say not in query being that they weren't selected for columns. I think it would make more sense to either omit them all together, always include them in the query but not necessarily put them in the table, or do another query for that information upon selecting the individual puzzles.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
I'm certainly open to changing it.  Here's my rationale for the way it is now.

Although you don't see them yet, there are going to be tons of columns available.  (I think the last A/B project has over 100.)  I'm trying to find a balance between overwhelming the user with data (which brings with it slower downloads and more sluggish table interactions) and overwhelming the user with choices, including but not limited to selecting columns to download.  As it stands now, there are only two columns -- project ID and design ID -- that are mandatory to making the browser function.  I could just as easily simply omit the Designer label (for example) if the user hasn't selected that column for download.  But then then the user doesn't get any hint that the browser could display the designer if desired.

This particular case may be moot at the moment, because I'm changing the content of the 2D display to use Nando's embedded flash app.  But the same design decision will come up again, sooner more likely than later.  So just hold that thought for a little.
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
As I mentioned at one point, what might help is to split up the columns into sections, either to select everything in the group or to be able to just quickly find the right thing and keep the interface clean.
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
Btw when can we expect to see a stable/"production" API to access this data? I know at least Jen would like to access some of this data for DPAT, and I'll be creating a toolset for that so I'm curious on what the timeline is.
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
That makes sense.

When looking for the field, should it be dynamic somehow, or should I be hard-coding the source and destination values?
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
@Meechl:  Thank you for the offer.  My emphasis at this point is to develop the process for routinely and quickly getting all of the routinely desired data from Johan's experimental spreadsheets, plus the corresponding Eterna pre-experimental data from the Eterna server, into the data browser's fusion table.  If we routinely want more columns, we should add them at the source, e.g. ask Johan to include them in his spreadsheet.

But I will really appreciate your help when it comes to "filling in" data columns for projects that are entered before we have the routine down.  I'm not sure exactly what that is going to entail but if you have the time and interest when that time comes, I'll accept!

(There's also the issue of being able to incorporating ad hoc "external" data into the data browser's table, but that's even farther in the future.)
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
@LFP6: For this application we'll always be matching on the design ID.  But looking at https://www.google.com/fusiontables/DataSource?docid=1j1vqL-JixKkKCw0QoVBSeLsbOfpsZ05Tbw4QFZlb#rows:..., I see that I decided on the canonical name Design_ID, not DesignID.
Photo of LFP6

LFP6, Player Developer

  • 598 Posts
  • 108 Reply Likes
Not sure if I was completely clear. Should the column name I'm looking for in the source and the destination be hard coded, or should I be looking for some pattern, not assuming that the column names will be a particular value?
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
It can be hard coded to "Design ID", and the sample sheet I made be fixed up accordingly.

Of course it always good practice to have a constant like this defined only once in a program, so there is only one place in the code to change if that is called for.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
OK, I have a very rough prototype of embedding the flash-based 2D structure in the new browser.  It is rough enough that I don't really want to even install it on eternadev.org yet.  But I think a screenshot will serve to clarify the choices we might have.



You'll see that I have selected four designs, and there are now four instances of the flash code running in the 2D Structure tab of the right panel.  These have almost all of the interactiveness of legacy view, the main absences being access to the legacy design list and puzzle submission.

An alternative is to have just one instance in the right panel, and use keystrokes to move between the selected designs.  This user interaction would be more like the legacy flash app.

I think I like being able to see multiple designs at the same time.  What do others think?

(If you look closely, you'll see oddities in the screenshot, like the puzzle names in the flash windows not being right, and there being nothing in the right panel that tells you the design name of each flash instance .  That's all part of what makes it a rough prototype.)
Photo of JR

JR

  • 240 Posts
  • 20 Reply Likes
I like the multiple views but still would want the ability to futz with it in puzzle submission mode.
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
Thats an important point you bring up there, JR.

One of the greatest strengths and things that is important even after a lab design has gotten result, is that it can still be changed to see what it would do. That's an active way of checking ideas when analysing. Plus it is also what I do when I decide on to make a mod of a past lab design for a new lab. I simply play with it to see if certain things work. And then I copy the sequence to the active lab either when I'm done modifying or think the design could be interesting modifying.

Which reminds me that it would be awesome if that process is somehow supported. Like when watching past results and wanting to modify if we could beam the lab result that we want to use either modified or intend to modify, directly to the new lab  - if such a lab is open. That would save a lot back and forth between different screens and I even suspect it will make more players use past results for designing.

The direct interaction with the puzzle is one of the strongest features. The design is not just a static image. It being interactive is both a toy and tool.

Now the image above shows 4 design. Would an single design view show both/all states?

Also we need to be able to shift energy model. (Not all puzzles need that) I know I want it directly in the design viewer - because this allows me to blow the viewer to full size - and "D" my way through a huge trail of designs with nothing but the design seen. But still have the ability to change settings when I think it will be better for the individual design to be viewed in another model.

Omei, I will like to be able to see multiple designs against each other. That would be rather cool together with sorting. So keeping the starting point as one window and moving through the variations below.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
I got some help from Nando, and I've now put up a (still rough) prototype at http://www.eternadev.org/lab/data-browser.html.  

The first thing you need to know is that you must select the puzzle id and sequence fields for download; there is no enforcement of that.  And there is a major irritation in that resizing the right panel completely reloads the flash app.  But having something that actually works will let us see whether we are all wanting basically the same thing (it seems like it) and what needs refinement before we can check off this item from the showstopper list.
Photo of JR

JR

  • 240 Posts
  • 20 Reply Likes
Latest changes to "2d Structure" tab look very  good.
I was going to ask for a 3rd tab with "Dot Plot" so I could see a list of Dot Plots for my multiple selection but I can do that manually now with the interactive 3rd window.
To get rid of the end user once (haha) and for all I used to do one last thing and that was to front-end the application with a entry screen that let the user save data selection (into a comma delimited string) by user "name/their title" so they could come back later and "fetch" their study so their  "I thought I saw something back there" moment is never missed. I wrote it as an independent program that "calls" your main program and then windows a request to save when ending the application. Making it a separate program means able to use it elsewhere.
(Edited)
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
This sounds cool, JR!  The notion of easily capturing the essence of an investigation you might want to return to later is really powerful.

I'm not sure I understand what you did and how, though.  This is something you did that worked with one of the Eterna web pages?  If so, what did you save in your CSV file, and how did you extract that data from the application.  Or were you presenting this as a general idea that we could incorporate into the browser?
Photo of JR

JR

  • 240 Posts
  • 20 Reply Likes
This was with another language and another application and for a large company. Don't know if you can capture flash screen parms or how much work it would be. Since you wrote the screens you might be able to say... that's easy or that's going to be just too much work. If it's not easy them I
would skip it.
Photo of Omei Turnbull

Omei Turnbull, Player Developer

  • 966 Posts
  • 304 Reply Likes
Progress update: In addition to improvements in the handling of the interactive 2D structure view, I have added a right-click menu for copying to the clipboard either the sequence or a legacy URL for the selected design.
Photo of Eli Fisker

Eli Fisker

  • 2222 Posts
  • 483 Reply Likes
This reminds me that we have no options for casting or deleting votes. Would be practical if the voting column already there could get a box for a tick of.