index.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="generator" content="GitLab Pages">
  <title></title>
  <link rel="stylesheet" href="../assets/css/style.css">
  <link rel="stylesheet" href="../assets/css/mobile.css">

  <style>
    .cover{margin-top:48px;display:flex}.cover img{width:250px;object-fit:contain;margin-bottom:auto;box-shadow:0 1px 4px -1px #00000069}.metadata{display:flex;flex-direction:column;margin-left:1em}.title{flex-grow:1;font-size:2em;font-weight:700}.metadata-item{display:flex;flex-direction:column;margin-top:24px}.download-item{display:flex;margin-top:24px}.metadata-name{border-bottom:1px solid #cacaca;border-image:linear-gradient(to right,#cacaca,#ffffff00) 1;margin-bottom:5px}.supervisors{display:flex;flex-direction:column}.button{background-color:#4caf50;border:none;color:#fff;padding:15px 32px;text-align:center;text-decoration:none;display:inline-block;font-size:16px}@media only screen and (max-width :450px){.cover{flex-wrap:wrap}.cover img{width:100%}}
  </style>

</head>

<body>
  <header id="header">
    <div class="row">
      <div class="logo" id="logo"></div>
      <div class="hamburger">
        <div class="line"></div>
        <div class="line"></div>
        <div class="line"></div>
      </div>
      <nav></nav>
    </div>
    <div id='projectname'></div>
  </header>
  <div class="content">

    <div class="cover">
      <img src="cover.jpg">
      <ul class="metadata">
        <li class="metadata-item title">
          Outdoor Mobile Augmented Reality in Urban Planning; Concepts of Visualizing Focus and Context Using Grayscale Filter in Video-based AR.
        </li>
        <li class="metadata-item">
          <div class="metadata-name">Author</div>
          <div>Justin Jing Hui</div>
        </li>
        <li class="metadata-item">
          <div class="metadata-name">Supervisors</div>
          <div class="supervisors">
            <div>Prof. Dr.-Ing. Volker Coors</div>
            <div>Prof. Dr.-Ing. Eberhard Gülch</div>
          </div>
        </li>
        <li class="metadata-item">
          <div class="metadata-name">Year</div>
          <div>2021</div>
        </li>
        <li class="download-item"><a href="thesis.pdf" class="button" download>download</a></li>
      </ul>
    </div>

    <h1>Abstract</h1>

    <p>
      Urban planners and designers often use grayscale masking filters to highlight a selected urban feature and its context without the overwhelming   information. With the rising interest in applying augmented reality (AR) technology into the field of urban planning for increasing social engagement, this thesis aims to develop an outdoor mobile AR application that visualizes the urban environment using the mentioned grayscale masking filters. The application is able to apply the grayscale masking filter to the designated buildings in Nordbahnhof, Stuttgart when the device’s camera is pointing to them. State of the art of  outdoor mobile AR technologies are studied and reviewed. This thesis proposes the concepts and methodology of the video-based AR visualization and the development of the app. The implementation of the concepts and methodology is documented and the implementation process and result are evaluated.
    </p>

    <h1>Demo</h1>

    <p>
      More about the development of the application can be found in the following repository:
      <br></br>
      <a href="https://transfer.hft-stuttgart.de/gitlab/huijustinjing/ar-building-visualization-with-grayscale-filter"> Application Developement Repository</a>
    </p>

  </div>

  <div class="footer"></div>
  <div class="legal"></div>

  <script src="../settings.js"> </script>
  <script src="../main.js"> </script>
</body>

</html>