Commit 1f2f2043 authored by Lasse Overgaard Møldrup's avatar Lasse Overgaard Møldrup
Browse files

Add personas

parent 3032cb4b
Pipeline #49903 passed with stage
in 39 seconds
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Issac Euler Jensen</h1>
<div id="content">
<div id="left">
<div id="top">
<img src="Isaac.png" style="object-position: 100% 100%;"/>
<span id="quote">"I have three deadlines for next week."</span>
<p id="small-desc">Isaac Euler Jensen is a first year student at Aarhus University studying maths. He likes to keep on top of his homework, which he has a lot of. Isaac has come to Aarhus University straight from high school, and he wants to pursue a career in the academic world.</p>
</div>
<div id="bot">
<p id="big-desc">Isaac Euler Jensen's education revolves around handing in several academic papers each week. He has strict deadlines for each of his courses which results in him needing to be able to access these deadlines easily. He also has several exercise classes each week for each of his courses. For these hand-ins and exercise classes he uses a lot of different mathematical literature. He spends a lot of time with this literature both preparing for exercise classes and lectures.
For him the most important aspect of a platform for education is easy access to deadlines and course content. He does not care too much about a calendar displaying his weekly schedule for example, as it is the same every week. He does not need any collaboration tools, as he hands in individually in all courses. So if he could design the perfect platform for education, it would just be a platform with seamless access to deadlines and course content. Nothing more.</p>
</div>
</div>
<div id="right">
<strong>Goals</strong>
<ul>
<li>Have a career in the academic world,</li>
<li>Stay at the top of the class,</li>
<li>Learn and understand math at a higher level.</li>
</ul>
<strong>Tasks</strong>
<ul>
<li>Read current week's literature,</li>
<li>Prepare for upcoming exercise classes,</li>
<li>Complete and deliver many assignments per week.</li>
</ul>
<strong>Roles</strong>
<ul>
<li>Top student.</li>
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Kathrine-Marie Strange</h1>
<div id="content">
<div id="left">
<div id="top">
<img src="Kathrine-Marie.png"/>
<span id="quote">"I'm excited for my traineeship at the local medical facility next month."</span>
<p id="small-desc">Kathrine-Marie Strange is a fifth year medicine student with a high interest in her education. She tries to get as much real world experience practicing medicine to prepare her for career after the education.</p>
</div>
<div id="bot">
<p id="big-desc">Kathrine-Marie's weekdays are very busy with her difficult education, but she also wants free time for personal activities. It is therefore important to Kathrine-Marie that she can have a great overview of her weekly university schedule.
Her studies does not involve hand-ins or assignments, so she rather wants to have a feed of the most recent changes to her courses and upcoming exams. She often experiences changes in both location and times throughout the week and a quick overview would be greatly valued by Kathrine-Marie.
On the perfect platform of education for her you would be able to see the recent changes in the courses and a large schedule of the week. She needs this to coordinate her time and notice important changes. She would also appreciate not having too much information on her front-page, and letting her focus on practical learning would increase her likability of her front-page.</p>
</div>
</div>
<div id="right">
<strong>Goals</strong>
<ul>
<li>Get real world experience in a clinic to prepare for a career as general practitioner,</li>
<li>Keep a structured schedule in her everyday life to make time for activities besides her studies.</li>
</ul>
<strong>Tasks</strong>
<ul>
<li>Find and read literature for the courses,</li>
<li>Attend lectures and exercise classes when she's not at the clinic,</li>
<li>Work in the clinic utilizing her knowledge.</li>
</ul>
<strong>Roles</strong>
<ul>
<li>Student,</li>
<li>Friend,</li>
<li>Trainee.</li>
</ul>
</div>
</div>
</body>
</html>
\ No newline at end of file
html, body {
width: 100%;
height: 100%;
font-family: Arial, Helvetica, sans-serif;
}
* {
box-sizing: border-box;
}
body {
padding: 20px;
background: #ecf5f7;
}
p {
margin: 0;
padding: 0;
}
#content {
display: flex;
width: 100%;
}
#left, #right {
flex-basis: 300px;
}
#left {
flex-grow: 5;
display: flex;
flex-direction: column;
margin-right: 10px;
}
#right {
flex-grow: 2;
margin-left: 10px;
}
#top, #bot {
border: 2px solid lightgray;
background: linear-gradient(#C4DFE6, #ecf5f7);
padding: 10px;
}
#top {
margin-bottom: 20px;
}
#quote {
font-style: italic;
font-weight: 900;
display: block;
margin-bottom: 5px;
}
img {
float: left;
width: 300px;
height: 300px;
object-fit: cover;
object-position: 0 0;
margin-right: 20px;
}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment