-
Bernard Roland (Student Com20) authoredBernard Roland (Student Com20) authored
index.html 10.11 KiB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="icon" type="image/svg+xml" href="img/favicon.svg">
<meta name="name" content="ryoko | plan your projects like a journey">
<meta name="description"
content="ryoko is a project planning tool created for developers to organize their tasks effectively">
<meta property="og:title" content="Try planning your next project with ryoko!">
<meta property="og:image" content="img/header.jpg">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
<title>ryoko | plan your projects like a journey</title>
</head>
<body>
<div class="page-container">
<main>
<section class="hero-section">
<div class="hero-container">
<header>
<a href="index.html">
<img src="img/logo.svg" alt="Logo" width="100" height="35">
</a>
<nav>
<a href="index.html">Home</a>
<a href="index.html#team">Team</a>
<a href="index.html#contact">Contact</a>
</nav>
</header>
<div class="content-container">
<div class="text-container">
<h1>ryoko</h1>
<p>Plan your projects like a journey!</p>
<div class="button-container">
<a href="#intro" class="button">Get started</a>
</div>
</div>
</div>
</div>
<div class="preview-container">
<div class="preview-phone">
<div class="inner">
</div>
</div>
</div>
</section>
<section class="intro-section" id="intro">
<div class="content-container intro-container">
<h2>Collaboration made easy with ryoko!</h2>
<p>
Do you want to boost your productivity and agility of your
development? <br>
With ryoko you are able to effectively plan your tasks
and manage your projects. It is build with developers in mind and
facilitates effective collaboration.
</p>
</div>
</section>
<section class="feature-section">
<div class="content-container feature-container">
<h2>Revolutionize your productivity</h2>
<div class="feature-list">
<div class="feature-item">
<span class="feature-icon material-icons">query_stats</span>
<h3 class="feature-title">Analyze your productivity</h3>
<div class="feature-description">
Find your <strong>weaknesses and strengths</strong> by analyzing graphs </div>
</div>
<div class="feature-item">
<span class="feature-icon material-icons">event</span>
<h3 class="feature-title">Automatic timetables</h3>
<div class="feature-description">
Generate your automatic timetables based on <strong>priorities and depencies</strong> of your tasks
</div>
</div>
<div class="feature-item">
<span class="feature-icon material-icons">group</span>
<h3 class="feature-title">Teambased</h3>
<div class="feature-description">
Distribute task within your Teams based on <strong>profession and difficulty</strong>
</div>
</div>
</div>
</div>
</section>
<section class="team-section" id="team">
<h2>Our Team</h2>
<p>
People are what makes a project great, and here are the people that make us
great.
</p>
<table>
<tr>
<td rowspan="3">
<img src="img/daniel-planoetscher.jpg" width="200" height="200"
alt="Daniel Planötscher"></img>
</td>
<th>Daniel Planötscher</th>
</tr>
<tr>
<th>Co-founder & Lead Web Developer</th>
</tr>
<tr>
<td>
Besides studying Computer Science, Daniel also enjoys taking photos and
designing user interfaces for hobby projects, which is why he focuses on
the FrontEnd of ryoko. Furthermore, he brings significant industry
experience working as a web developer using state of the art tools and
programming techniques. He is involved in the creation of modern
websites for dozens of clients with advanced requirements.
</td>
</tr>
<tr>
<td colspan="3">
<hr>
</td>
</tr>
<tr>
<td rowspan="3">
<img src="img/roland-bernard.jpg" width="200" height="200" alt="Roland Bernard"></img>
</td>
<th>Roland Bernard</th>
</tr>
<tr>
<th>Co-founder & Lead Software Engineer</th>
</tr>
<tr>
<td>
Studying Computer Science and participating in Competitive Programming
Competitions, Roland constitutes a integral part of our development team
at ryoko. Like all members of our team he also has experience in the
industry, mainly working on business management systems and software for
the financial sector. He is also experienced in the implementation of
development tools and infrastructure components.
</td>
</tr> </table>
</section>
<section class="contact-form" id="contact">
<h2>Get in touch</h2>
<p>
Do you still have a question? Just contact us directly and we will be glad
to help you resolve the issue.
</p>
<form action="mailto:dplanoetscher@unibz.it" method="POST">
<table>
<tr>
<td>
<label for="firstname">Firstname</label> <br>
<input type="text" required name="firstname" id="firstname">
</td>
<td>
<label for="lastname">Lastname</label> <br>
<input type="text" required name="lastname" id="lastname">
</td>
</tr>
<tr>
<td>
<label for="email">Email</label> <br>
<input type="email" required name="email" id="email">
</td>
<td>
<label for="subject">Subject</label> <br>
<input type="text" required name="subject" id="subject">
</td>
</tr>
<tr>
<td colspan="2">
<label for="message">Message</label> <br>
<textarea name="message" required id="message" cols="48" rows="10"></textarea>
</td>
</tr>
<tr>
<td>
<input type="submit" value="Send">
</td>
</tr>
</table>
</form>
</section>
</main>
<footer>
<table>
<tr>
<td>
<div>
<img src="img/logo.svg" alt="Logo" width="70" height="24"> <br>
<div>
© <a href="index.html">ryoko</a>, 2021 <br>
All rights reserved.
</div>
</div>
</td>
<td>
<div>
<h3>Find out more!</h3>
<ul>
<li>
<a href="index.html">Home</a>
</li>
<li>
<a href="index.html#team">Team</a>
</li>
<li>
<a href="index.html#contact">Contact</a> </li>
</ul>
</div>
</td>
</tr>
</table>
</footer>
</div>
</body>
</html>