"
Team:SUSTC-Shenzhen-A/Notebook/User Interface
From 2012.igem.org
- 1
- 2
- 3
Contents |
brief introduction
This part includes viewing datas by category, searching datas, bookmarks and help. Six members devided into three groups worked on it, and two of the groups were working on part category-formed-interface, which simplifys the long spreadsheet into keyword-showing tables.
7.18～7.19
Category:Analyzing the target website, members determined to provide four kinds of showing type:parts by type;parts by function; parts by chassis and devices by type. Then members collected informations and codes ,in order to show a user friendly interface.
SE:Members discussed about the searching methods and searchstring. At first a picker was chosen for user to select the searching part(part name, discription and so on), and the searching method was fuzzy search --it means if you type "BBa_" and select "part name", the program will give you a result of all the biobricks whose part name includes "BBa_". The example is shown as image1.
At this time, the database was the first one we got (given by another iGEM team). For its complex database structure , the keyword needed to be searched in all 13 tables.
7.20～7.21
Category:After discussion, testing various styles, members decided to use folder form. Besides, every secondary part was devided into two section:description and list. Description was the introduction of the secondary title(eg. promoter), when the table was touchand list was the collection of all the biobrick in this category. The initial design is shown as image2.
SE:The interface was totally changed in these days. The picker was changed by several input fields, including part name, category, direction and length. And more options could be added if user needed. The sketch map was shown below(image3).
7.22
For the database was totally updated, all the works came down to datas need to redo.
Category:This new database greatly simplified list forming. All the informations could be found in a single, huge table.
SE:Using the original database, the datas needed to be searched twice in the whole process. First, when users type the keyword and clicked "search", all the tables were searched with this keyword to get the biobrick, then sended the part name to search result part. Then the second search took place when the search result part got the partname. The partname was searched in all the tables to give user a detailed page of this biobrick's imformation. In short, the tables needed to be searched by keyword and the part name.
But with this renewed database, we could search in only one table.
7.23
A Communication with BGI. For more imformations,please click here.
'7.24～7.25
Parts of searching and category had been combined. The rudiment was set up and next would be detail enhancement and uniting style. The flow chart is shown as image4.
揪心的表示我似乎要把这个改成横板
7.26～7.27
All the parts had been combined and both of bookmark(called history in the toolbar) and help had been set up. The problems remained were to ensure the style and fix all the bugs. The interface of help:
The interface of bookmark:
