Team:Paris Bettencourt/Minder

From 2014.igem.org

(Difference between revisions)
 
(106 intermediate revisions not shown)
Line 31: Line 31:
                 margin-left : 5%;
                 margin-left : 5%;
}
}
-
#logo:hover #logoblanc {
+
 
-
}
+
#tablelien {
-
#logo:hover #logorose {
+
-
}
+
-
#tablelien {
+
width : 100%;
width : 100%;
-
height : 60px;
+
height : 50px;
text-align : center;
text-align : center;
-
background-color : rgb(225,0,112);
+
background-color : rgb(255,255,255);
}
}
#tablelien tr td {
#tablelien tr td {
width : 20%;
width : 20%;
-
height : 60px;
+
height : 50px;
-
color : rgb(193,185,184);
+
font-size : 16px;
-
                font-size : 16px;
+
background-color : rgb(255,255,255);
-
background-color : rgb(225,0,112);
+
}
 +
#tablelien tr td a {
 +
color : rgb(197,192,193);
 +
text-decoration : none;
}
}
p {
p {
Line 52: Line 52:
background-color : transparent;
background-color : transparent;
}
}
-
        #fond {
+
.project {
-
                width : 100%
+
-
                height : 300px;
+
-
background : rgb(225,0,112);
+
-
}
+
-
#part1 {
+
width : 100%;
width : 100%;
-
height : 350px;
 
display : inline-block;
display : inline-block;
}
}
-
#part1 p {
+
        .project_right {
-
display : inline-block;
+
                width : 45%;
 +
                display : inline-block;
 +
                float: right;
 +
                margin-left : 2.5%;
 +
                margin-right : 2.5%;
 +
        }
 +
        .project_right .text {
 +
                display : inline-block;
vertical-align : middle;
vertical-align : middle;
position : relative;
position : relative;
-
width : 44%;
 
-
margin-left : 5%;
 
-
                font-size : 15px;
 
-
}
 
-
#part1 img {
 
-
position : absolute;
 
-
width : 44%;
 
-
height : 250px;
 
-
                left : 51%;
 
-
background-color : rgb(197,192,193);
 
-
}
 
-
#part2 {
 
width : 100%;
width : 100%;
-
height : 350px;
+
margin-left : 4%;
-
display : inline-block;
+
                margin-right : 4%;
-
}
+
-
#part2 p {
+
-
display : inline-block;
+
-
vertical-align : middle;
+
-
position : relative;
+
-
width : 44%;
+
-
margin-left : 5%;
+
                 font-size : 15px;
                 font-size : 15px;
-
 
+
        }
-
}
+
.project .text1 {
-
#part2 img {
+
-
position : absolute;
+
-
width : 44%;
+
-
height : 250px;
+
-
                left : 51%;
+
-
background-color : rgb(197,192,193);
+
-
}
+
-
#part3 {
+
-
width : 100%;
+
-
height : 350px;
+
-
display : inline-block;
+
-
}
+
-
#part3 p {
+
display : inline-block;
display : inline-block;
vertical-align : middle;
vertical-align : middle;
position : relative;
position : relative;
-
width : 44%;
+
width : 43%;
-
margin-left : 5%;
+
margin-left : 4%;
 +
                margin-right : 4%;
                 font-size : 15px;
                 font-size : 15px;
 +
                float : left;
}
}
-
#part3 img {
+
.project .text2 {
-
position : absolute;
+
float : right;
-
width : 44%;
+
width : 43%;
-
height : 250px;
+
                 margin-right : 4%;
-
                 left : 51%;
+
-
background-color : rgb(197,192,193);
+
-
}
+
-
#part4 {
+
-
width : 100%;
+
-
height : 350px;
+
-
display : inline-block;
+
-
}
+
-
#part4 p {
+
-
display : inline-block;
+
-
vertical-align : middle;
+
-
position : relative;
+
-
width : 44%;
+
-
margin-left : 5%;
+
                 font-size : 15px;
                 font-size : 15px;
}
}
-
#part4 img {
+
        .project .list {
-
position : absolute;
+
                position : absolute;
-
width : 44%;
+
                margin-left : 5%;
-
height : 250px;
+
        }
-
                 left : 51%;
+
      .singleimage {
-
background-color : rgb(197,192,193);
+
                width : 50%;
-
}
+
                margin-left : 25%;
 +
      }
 +
      .doubleimage {
 +
                 width : 100%;
 +
      }
 +
      .legend1 {
 +
                display : inline-block;
 +
                margin-left : 25%;
 +
                margin-right : 25%;
 +
                font-size : 11px;
 +
        }
 +
        .legend2 {
 +
                font-size : 11px;
 +
        }
#top {
#top {
position : fixed;
position : fixed;
Line 150: Line 120:
                 height : 100%;
                 height : 100%;
         }
         }
-
.nameimg {
+
        .nameimg {
position : absolute;
position : absolute;
-
width : 200px;
+
width : 180px;
-
height : 200px;
+
margin-left : 8%;
-
margin-left : 10%;
+
                margin-top : 100px;
background : transparent;
background : transparent;
z-index : 60;
z-index : 60;
}
}
 +
        #fond {
 +
                width : 100%
 +
                height : 300px;
 +
background : rgb(255,0,99);
 +
        }
 +
#headtable {
 +
width : 92.5%;
 +
height : 300px;
 +
text-align : center;
 +
background : rgb(255,0,99);
 +
                margin-right : 3.75%;
 +
                margin-left : 3.75%;
 +
}
 +
#headtable tr td {
 +
width : 33.333%;
 +
heigth : 100%;
 +
color : rgb(255,255,255);
 +
                font-size : 14px;
 +
}       
 +
        #headtable tr td b {
 +
              font-size : 18px;
 +
        }
         .text1 {
         .text1 {
-
              text-align : justify;
 
               margin-left : 5%;
               margin-left : 5%;
               margin-right : 5%;
               margin-right : 5%;
 +
        }
</style>
</style>
<body>
<body>
<p id=top><a href="#topheader"><img src="https://static.igem.org/mediawiki/2014/4/41/Arrow.png"></a></p>
<p id=top><a href="#topheader"><img src="https://static.igem.org/mediawiki/2014/4/41/Arrow.png"></a></p>
<div id="topheader">
<div id="topheader">
-
<img src="https://static.igem.org/mediawiki/2014/b/b1/Smelltheroses.png" class=nameimg>
+
<img src="https://static.igem.org/mediawiki/2014/f/f3/PB14minder.png" class=nameimg>
</div>
</div>
-
<div id=logo><img id=logorose src=""></div>
+
<div id=fond>
 +
        <table id=headtable>
 +
<tr>
 +
<td><b>BACKGROUND</b></br><br>
 +
<p class=text1>Mobile dating apps, like Tinder or POF (Plenty Of Fish), have become increasingly popular in recent years and the concept of online dating is now starting to influence other sectors of human relations. Jobr, for example, is an app that connects recruiters with people who are looking for a job. How can we use the great potential of the online dating concept in the scientific world? </p></td>
 +
<td><b>AIMS</b></br><br>
 +
<p class=text1>We want to make an android app that allows you to present your scientific idea to the world, read the ideas of others, and get in contact with people to discuss or create projects. Through the app you can receive feedback on your own ideas and give feedback to other users by liking or disliking their ideas. </p></td>
 +
<td><b>ACHIEVEMENTS</b></br><br>
 +
<p class=text1>Our answer to Tinder is Minder. You can create ideas, rate other users' ideas, view an idea's like/dislike statistics, and find additional details and contact information for ideas you like. </p></td>
 +
</tr>
 +
</table>
 +
        </div>
 +
<table id=tablelien>
 +
<tr>
 +
<td><a href="#part1">Introduction</a></td>
 +
<td><a href="#part2">Homepage</a></td>
 +
<td><a href="#part3">Create an idea</a></td>
 +
                        <td><a href="#part4">View all your ideas</a></td>
 +
                        <td><a href="#part5">View all liked ideas</a></td>
 +
</tr>
 +
</table>
<div id=fond>
<div id=fond>
</table>
</table>
         </div>
         </div>
-
<br><br><br>
+
<br>
-
<div id=part1>
+
<div id=part1 class=project>
-
<h6>Minder</h6><br>
+
<div class=text1><h6>Introduction</h6><br>
-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut imperdiet diam eget quam imperdiet imperdiet. Mauris dapibus risus felis, sed ornare diam accumsan aliquet. Sed eu turpis porta, porttitor tortor et, condimentum augue. Curabitur a maximus nisi. Vivamus vitae magna ex. Donec congue auctor odio vitae tempus. In a gravida neque, et tristique tortor. Phasellus a odio sit amet enim ornare lobortis. Morbi sodales, diam non rutrum aliquam, ligula mauris consectetur urna, sed interdum quam risus sit amet enim. Aenean euismod enim magna, id pretium eros molestie non. Proin rutrum lobortis leo, sit amet congue erat. Nulla congue pellentesque augue porta dignissim. Pellentesque quis ex sollicitudin, condimentum risus varius, aliquet ipsum. Ut pulvinar aliquet maximus. Praesent imperdiet interdum commodo. </p>
+
<p>Ideas are more sexy than sex. Mobile dating apps like Tinder bring people together to explore shared goals. We want to bring this energy to creative people with ideas in science and beyond.<br><br>
-
<img src="">
+
Our idea is Minder: an app to share ideas. Present your idea to the world or find hot new ideas from others. Ideas are expressed in 140 characters and navigated with a single touch. See something you like? You can get in touch with the originator or with other Minders who share your interest. When two or more people get together to share ideas, who knows what might happen?<br><br>
 +
Current Features:<br>
 +
<ul><li>Input, store, and browse ideas.</li>
 +
<li>One touch like, pass, or flag for inappropriate inputs.</li>
 +
<li>Get more details and contact info when you like an idea.</li>
 +
<li>See how many people like and dislike your idea.</li></ul><br>
 +
 
 +
Planned Features:<br>
 +
<ul><li>Count your likes and rank the popularity of your idea.</li>
 +
<li>Geolocate active users with ideas near you.</li>
 +
<li>Text message and chat with idea originators.</li></ul><br>
 +
Minder cooperates with ideaweave, a web platform for building shared creative projects. Ideas in Minder can become challenges in ideaweave. Ideaweave supports forum discussion, file sharing, and collaborative work tools. Starting with a single touch, Minder can turn one person with an idea into a group of people working together.<br><br>
 +
You can find the source code for minder on GitHub.</p>
 +
</div>
 +
 
 +
<div class=text2>
 +
 
 +
                <p><img class=singleimage src="https://static.igem.org/mediawiki/2014/0/03/MinderLogoWithPhonepb.png"><br>
 +
                <span class=legend1><b>Figure 1. The logo of Minder.</b> This is shown while the app loads.</span></p>
 +
</div>
 +
</div><br><br><br><br>
 +
<div class=project>
 +
<div id=part2 class=text1><h6>The Homepage</h6><br>
 +
<p>The homepage of Minder shows you the ideas of other users one at a time. If you like the idea, click the like button, otherwise select the dislike button. If you think that an idea is not appropriate or is a duplicate of another idea, you can flag it with the report button. If you liked an idea, a page with further description of the idea and the contact information of the user who created it appears. On this page you are also given a link to see the next idea. Minder will only show you ideas that you have not rated yet. If you have seen all ideas in the database, you are given the option to see old ideas again.
 +
By selecting the menu button in the upper left corner of the homepage, you can navigate through the different functions of Minder, set tags and language filters for the displayed ideas, and log out. </p>
</div>
</div>
-
<div id=part2>
+
<div id=part3 class=text2>
-
<h6>Part: BBa</h6><br>
+
-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam bibendum purus eu neque finibus, eget pellentesque sapien viverra. Vestibulum ultrices posuere tempor. Maecenas ultrices sodales magna ac placerat. Sed a ex dignissim, ornare metus non, malesuada arcu. Etiam ullamcorper odio leo, at molestie eros sollicitudin in. Morbi aliquam scelerisque facilisis. Aenean tincidunt aliquam erat, quis ullamcorper nulla accumsan ac. Proin interdum nibh quam, in lacinia ipsum dignissim at. Nunc elementum lacus sed purus pharetra tincidunt. Sed ac velit vel turpis pulvinar accumsan ut in mauris. Praesent ac dapibus dui. Nullam finibus turpis et turpis sagittis congue. </p>
+
<h6>Create an Idea</h6><br>
-
<img src="">
+
<p>This page gives you the opportunity to define your idea and to share it with the Minder community. You need to select a title that describes your idea in a short, precise way and specifies the language of the idea. Your idea will be rated by the other users based on the title. You should also write a short paragraph of additional information. If you want to be contacted by the users who like your idea, you can include your contact information on this page. </p>
-
</div>
+
 
-
<div id=part3>
+
</div></div><br>
-
<h6>Part: BBa</h6><br>
+
<div class=project>
-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed sit amet laoreet metus, ac viverra dolor. Sed et orci imperdiet sem vulputate ultricies. Aliquam erat volutpat. Cras semper ex non odio aliquet, eget feugiat eros tempor. Integer hendrerit odio et bibendum maximus. Duis scelerisque lacus in odio faucibus fringilla. Nulla eleifend aliquet molestie. Morbi aliquam rhoncus efficitur. Proin consectetur augue aliquam risus convallis egestas. Nunc viverra felis non nibh consequat, nec faucibus ipsum rutrum. Proin placerat faucibus libero vitae dapibus. </p>
+
<div class=text1>
-
<img src="">
+
<p><img class=doubleimage src="https://static.igem.org/mediawiki/2014/8/88/MinderHomepagepg.png"><br>
-
</div>
+
                <span class=legend2><b>Figure 2. Design concept of Minder's homepage.</b> On this page you can rate ideas and manage all of Minder's functions through a user friendly menu.</span></p>
-
<div id=part4>
+
</div>
-
<h6>Part: BBa</h6><br>
+
<div class=text2>
-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam eu justo a dolor efficitur laoreet ut at lorem. Fusce dapibus lobortis nisi vehicula porttitor. In volutpat mauris et aliquam pellentesque. Vestibulum fringilla lacus metus, ac ullamcorper lectus sagittis sed. Suspendisse congue magna sed risus molestie aliquam. Sed placerat sagittis volutpat. Phasellus id erat neque. Quisque bibendum iaculis ante et feugiat. In hac habitasse platea dictumst. Fusce placerat lorem vel felis tincidunt, in elementum odio condimentum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec tincidunt bibendum lacus non viverra. Nulla mattis, ante vitae faucibus auctor, mi purus consequat dolor, non malesuada nulla lorem ac odio. </p>
+
 
-
<img src="">
+
<p><img class=singleimage src="https://static.igem.org/mediawiki/2014/d/d6/MinderCreateIdeapb.png"><br>
 +
                <span class=legend1><b>Figure 3. Design concept of Minder's page to create a new idea.</b> On this page you can create a new idea. The idea needs a title and a language; all other information is optional. The created idea will be stored in the database of the ideaweave project.</span></p>
 +
</div></div><br><br><br><br>
 +
 
 +
<div class=project>
 +
<div id=part4 class=text1><h6>View All Your Ideas</h6><br>
 +
<p>On this page you can see a list of all the ideas that you have created. Clicking on an idea will open a page with the rating of your idea and the opportunity to edit or delete it. But be careful, editing your idea will erase all of its rating information. </p>
</div>
</div>
 +
        <div id=part5 class=text2>
 +
<h6>View All Liked Ideas</h6><br>
 +
                <p>This page shows a list of all ideas you have liked. By selecting an idea you can view its detailed description and contact information. If you are not interested in an idea anymore, you can delete it from the list. However, you should consider that this will delete your like of the idea and effect the idea's rating. </p>
 +
        </div></div><br>
 +
<div class=project>
 +
<div class=text1>
 +
<p><img class=doubleimage src="https://static.igem.org/mediawiki/2014/8/81/MinderViewMyIdeas.png"><br>
 +
                <span class=legend2><b>Figure 4. Design concept of Minder's page to view your created ideas.</b> This page shows all ideas you created. Selecting an idea will give you more information and enables editing and deletion.</span></p>     
 +
</div>
 +
<div class=text2>
 +
<p><img class=singleimage src="https://static.igem.org/mediawiki/2014/f/f4/MinderViewIdeaspb.png"><br>
 +
               
 +
<span class=legend1><b>Figure 5. Design concept of Minder's page to view your liked ideas.</b> This page shows all ideas you have liked. Selecting an idea will give you the idea's additional information.</span></p>
 +
</div></div><br><br>
</body>
</body>
</html>
</html>
{{:Team:Paris_Bettencourt/Footer}}
{{:Team:Paris_Bettencourt/Footer}}

Latest revision as of 03:50, 18 October 2014

BACKGROUND

Mobile dating apps, like Tinder or POF (Plenty Of Fish), have become increasingly popular in recent years and the concept of online dating is now starting to influence other sectors of human relations. Jobr, for example, is an app that connects recruiters with people who are looking for a job. How can we use the great potential of the online dating concept in the scientific world?

AIMS

We want to make an android app that allows you to present your scientific idea to the world, read the ideas of others, and get in contact with people to discuss or create projects. Through the app you can receive feedback on your own ideas and give feedback to other users by liking or disliking their ideas.

ACHIEVEMENTS

Our answer to Tinder is Minder. You can create ideas, rate other users' ideas, view an idea's like/dislike statistics, and find additional details and contact information for ideas you like.

Introduction Homepage Create an idea View all your ideas View all liked ideas

Introduction

Ideas are more sexy than sex. Mobile dating apps like Tinder bring people together to explore shared goals. We want to bring this energy to creative people with ideas in science and beyond.

Our idea is Minder: an app to share ideas. Present your idea to the world or find hot new ideas from others. Ideas are expressed in 140 characters and navigated with a single touch. See something you like? You can get in touch with the originator or with other Minders who share your interest. When two or more people get together to share ideas, who knows what might happen?

Current Features:

  • Input, store, and browse ideas.
  • One touch like, pass, or flag for inappropriate inputs.
  • Get more details and contact info when you like an idea.
  • See how many people like and dislike your idea.

Planned Features:
  • Count your likes and rank the popularity of your idea.
  • Geolocate active users with ideas near you.
  • Text message and chat with idea originators.

Minder cooperates with ideaweave, a web platform for building shared creative projects. Ideas in Minder can become challenges in ideaweave. Ideaweave supports forum discussion, file sharing, and collaborative work tools. Starting with a single touch, Minder can turn one person with an idea into a group of people working together.

You can find the source code for minder on GitHub.


Figure 1. The logo of Minder. This is shown while the app loads.





The Homepage

The homepage of Minder shows you the ideas of other users one at a time. If you like the idea, click the like button, otherwise select the dislike button. If you think that an idea is not appropriate or is a duplicate of another idea, you can flag it with the report button. If you liked an idea, a page with further description of the idea and the contact information of the user who created it appears. On this page you are also given a link to see the next idea. Minder will only show you ideas that you have not rated yet. If you have seen all ideas in the database, you are given the option to see old ideas again. By selecting the menu button in the upper left corner of the homepage, you can navigate through the different functions of Minder, set tags and language filters for the displayed ideas, and log out.

Create an Idea

This page gives you the opportunity to define your idea and to share it with the Minder community. You need to select a title that describes your idea in a short, precise way and specifies the language of the idea. Your idea will be rated by the other users based on the title. You should also write a short paragraph of additional information. If you want to be contacted by the users who like your idea, you can include your contact information on this page.



Figure 2. Design concept of Minder's homepage. On this page you can rate ideas and manage all of Minder's functions through a user friendly menu.


Figure 3. Design concept of Minder's page to create a new idea. On this page you can create a new idea. The idea needs a title and a language; all other information is optional. The created idea will be stored in the database of the ideaweave project.





View All Your Ideas

On this page you can see a list of all the ideas that you have created. Clicking on an idea will open a page with the rating of your idea and the opportunity to edit or delete it. But be careful, editing your idea will erase all of its rating information.

View All Liked Ideas

This page shows a list of all ideas you have liked. By selecting an idea you can view its detailed description and contact information. If you are not interested in an idea anymore, you can delete it from the list. However, you should consider that this will delete your like of the idea and effect the idea's rating.



Figure 4. Design concept of Minder's page to view your created ideas. This page shows all ideas you created. Selecting an idea will give you more information and enables editing and deletion.


Figure 5. Design concept of Minder's page to view your liked ideas. This page shows all ideas you have liked. Selecting an idea will give you the idea's additional information.



Centre for Research and Interdisciplinarity (CRI)
Faculty of Medicine Cochin Port-Royal, South wing, 2nd floor
Paris Descartes University
24, rue du Faubourg Saint Jacques
75014 Paris, France
+33 1 44 41 25 22/25
paris-bettencourt-igem@googlegroups.com
Copyright (c) 2014 igem.org. All rights reserved.

Retrieved from "http://2014.igem.org/Team:Paris_Bettencourt/Minder"