nwHacks2017.github.io/index.html at master · nwHacks2017/nwHacks2017.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta property="og:title" content="LifeBand">
    <meta property="og:url" content="https://nwhacks2017.github.io/">
    <meta property="og:description" content="App to improve patient identification with through easier record access.">
    <meta property="og:image" content="res/img/team/presenting.jpg">

    <link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="favicon-16x16.png">
    <link rel="manifest" href="/site.webmanifest">

    <title>LifeBand</title>

    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans">
    <link rel="stylesheet" href="lib/bootstrap-4.3.1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="res/css/styles.css">
  </head>

  <body>

  <header>
    <img class="img-fluid d-block mx-auto" id="banner" src="res/img/logos/banner.png">
  </header>

  <div id="about-content">

    <p class="mt-5">
      <strong>LifeBand</strong> is a wristband system designed to alleviate patient misidentification in hospitals and senior centers by managing patient medical record access.
    </p>
    <p>
      The project was created during March 18-19, 2017 for <a href="https://www.nwhacks.io/" target="_blank">nwHacks 2017</a>, an annual hackathon hosted by StartupStorm from the University of British Columbia.
    </p>

    <a href="https://github.com/nwhacks2017" target="_blank">
      <img class="img-fluid d-block mx-auto company-logo my-5" src="res/img/logos/github.png" alt="GitHub logo" title="View the source code on GitHub">
  	</a>

    <p>
      <i>We placed among the <strong>top 5 projects.</strong></i>
    </p>

    <img class="img-fluid d-block mx-auto" src="res/img/team/presenting.jpg" alt="Team picture">

    <h1 class="my-4">The Inspiration and Problem</h1>

    <p>
      According to a study by the esteemed Johns Hopkins University, the third leading cause of death in the US is <a href="https://www.washingtonpost.com/news/to-your-health/wp/2016/05/03/researchers-medical-errors-now-third-leading-cause-of-death-in-united-states/" target="_blank">patient misidentification</a>. Over a quarter of a million people die annually due to preventable medical errors - in other words, 700 deaths a day, or 1 death every two minutes. These medical errors can be miscommunications between people or departments, use of the wrong medication, errors in system design, failure to complete a planned action, or deviation from process.
    </p>
    <p>
      We set out to envision a technological solution which better ties patients to their medical records, improves accessibility of information, and permits better restriction of information.
    </p>

    <h1 class="my-4">Solution</h1>

    <p>
      Our solution is an inexpensive system which could be scaled to the needs of an entire country's medical records and would allow for maximum availability even when under immense usage. Each patient has a medical bracelet which can be tapped with a phone to open the patient's medical records on an application.
    </p>

    <h2 class="my-4">Mockup</h2>

    <p>
      To better understand how a doctor would interact with the system, we designed a mockup showing the user flow and interaction. This showcases the user experience through the loading screen, bracelet scanning, and information display.
    </p>

    <video autoplay="autoplay" loop="loop" muted="muted">
      <source src="res/vid/mockup.mp4" type="video/mp4">
    </video>

    <h2 class="my-4">The System</h2>

    <p>
      Inexpensive and small identification tags which emit <a href="http://electronics.howstuffworks.com/nfc-tag.htm" target="_blank">NFC</a> are attached to hospital beds, or placed on wristbands and given to residents of senior centers. These are registered with the records of the person they are given to. Users interact with the tags by opening an Android application and scanning the tag with their NFC-enabled device.
    </p>

    <p>
      This system is quick to respond and gathers information in real time. It is easy to use for those in the healthcare industry, and it is cheap to implement with minimal hardware components.
    </p>

    <h2 class="my-4">Technologies</h2>

    <p>
      The application will contact a <a href="https://golang.org/" target="_blank">Golang</a> server which will query a <a href="https://github.com/cockroachdb/cockroach" target="_blank">CockroachDB</a> relational database, both of which are hosted on <a href="https://aws.amazon.com/" target="_blank">Amazon Web Services</a>. The patient data returned will be displayed on the device.
    </p>

    <img class="img-fluid d-block mx-auto" src="res/img/architecture.png" alt="Architecture diagram">

    <img class="img-fluid d-block mx-auto" src="res/img/flow.png" alt="Flow diagram">

    <h3 class="my-4">Near-Field Communication (NFC)</h3>

    <a href="https://developer.android.com/guide/topics/connectivity/nfc" target="_blank">
      <img class="img-fluid d-block mx-auto company-logo my-4" src="res/img/logos/nfc-tag.jpg" alt="NFC tag">
    </a>

    <p>
      Each patient bracelet contains a light and cheap NFC tag. When the user taps the phone against the bracelet, the tag emits a small piece of data which identifies the patient uniquely, but does not include any confidential patient data itself.
    </p>
    <p>
      Therefore, no sensitive data is exposed outside of the application and online database.
    </p>

    <h3 class="my-4">Android Application</h3>

    <a href="https://www.android.com/" target="_blank">
      <img class="img-fluid d-block mx-auto py-4 company-logo" src="res/img/logos/android.svg" alt="Android logo">
    </a>

    <p>
      The mobile application on Android is ideally designed to require authentication by doctors and nurses before accessing patient information, as well as authorization based on what level of care they are providing. Upon tapping an NFC bracelet, the app contacts the server with the patient ID and will receive the data to be displayed.
    </p>
    <p>
      The data displayed can include personal information, history, emergency information, and medication.
    </p>

    <h3 class="my-4">Golang</h3>

    <a href="https://golang.org/" target="_blank">
      <img class="img-fluid d-block mx-auto company-logo" src="res/img/logos/golang.png" alt="Golang logo">
    </a>

    <p>
      The backend server, written in Golang, was designed to handle retrieval of patient data. Every request from the application contacts the server with a unique patient ID to request the information of that specific patient. Ideally, the server only provides the information pertinent to the level of care which the app is signed into. For example, surgeons will need more information than nurses.
    </p>

    <h3 class="my-4">CockroachDB</h3>

    <a href="https://www.cockroachlabs.com/" target="_blank">
      <img class="img-fluid d-block mx-auto company-logo" src="res/img/logos/cockroach-db.jpg" alt="CockroachDB logo">
    </a>

    <p>
      The database, a CockroackDB instance, provides patient data for the server to access. The instance is easily scalable, and is replicated with a triple-node architecture.
    </p>

    <h3 class="my-4">Amazon Web Services</h3>

    <a href="https://aws.amazon.com/" target="_blank">
      <img class="img-fluid d-block mx-auto py-4 company-logo" src="res/img/logos/aws.png" alt="Amazon Web Services Logo">
    </a>

    <p>
      Throughout the duration of the hackathon, the backend and database were hosted on an EC2 instance of Amazon Web Services.
    </p>

    <h1 class="my-4">Results</h1>

    <p>
      We placed among the <b>top 5 projects</b> in the hackathon and were invited to present in front of all participants as well as the final judges.
    </p>

    <blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">
      Lifeband, an NFC bracelet that creates a seamless patient direction! <a href="https://t.co/0FwANq0pwF">pic.twitter.com/0FwANq0pwF</a></p>&mdash; nwPlus (nwHacks + UBC LHD + cmd-f) (@nwplusubc) <a href="https://twitter.com/nwplusubc/status/843608609049079808?ref_src=twsrc%5Etfw">March 19, 2017</a>
    </blockquote>
    <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

    <p>
      The judges consisted of:
      <ul>
        <li> <a href="https://en.wikipedia.org/wiki/Santa_J._Ono" target="_blank">UBC President <strong>Santa Ono</strong></a>,</li>
        <li>Previous CEO of <a href="https://pathful.aerobaticapp.com/" target="_blank">Pathful</a> and current CEO of <a href="https://www.proxxi.co/" target="_blank">Proxxi</a> (acquired by Mobify) <strong>Campbell Macdonald</strong>,</li>
        <li>Co-founder of <a href="https://www.optigo.net/" target="_blank">Optigo Networks</a> and board member of <a href="https://www.coastmentalhealth.com/" target="_blank">Coast Mental Health</a> <strong>Byron Thom</strong>, and</li>
        <li>Product Lead of <a href="https://1qbit.com/" target="_blank">1QBit</a> <strong>David Byrd</strong>.</li>
      </ul>
    </p>

    <blockquote class="twitter-tweet" data-lang="en"><p lang="en" dir="ltr">
      Our judges, <a href="https://twitter.com/cambel?ref_src=twsrc%5Etfw">@cambel</a>, David Byrd, <a href="https://twitter.com/ubcprez?ref_src=twsrc%5Etfw">@ubcprez</a> and <a href="https://twitter.com/bmthom?ref_src=twsrc%5Etfw">@bmthom</a>, are ready for the closing ceremonies! Are you? <a href="https://t.co/8CDANrufe9">pic.twitter.com/8CDANrufe9</a></p>&mdash; nwPlus (nwHacks + UBC LHD + cmd-f) (@nwplusubc) <a href="https://twitter.com/nwplusubc/status/843605150597959680">March 19, 2017</a>
    </blockquote>
    <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

    <h1 class="my-4">Lightning Talk Presentation</h1>

    <p class="my-4">
      A lightning talk was given by Jeffrey Leung on this project. View it here:
    </p>

    <iframe width="560" height="315" src="https://www.youtube.com/embed/gbXAl5zKDpA" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

    <h1 class="my-4">About</h1>

    <p>
      The creators of this project are <a href="https://github.com/KieranMcCormick" target="_blank">Kieran McCormick</a>, <a href="https://github.com/eul721" target="_blank">Jacky Chao</a>, <a href="https://github.com/carlsonchan" target="_blank">Carlson Chan</a>, <a href="https://github.com/jleung51" target="_blank">Jeffrey Leung</a>, and <a href="https://github.com/Brad1321" target="_blank">Bradley Dalrymple</a>.
    </p>

    <img class="img-fluid d-block mx-auto my-4" src="res/img/team/working.jpg" alt="Team picture">

    <hr>

    <p>
      <i>Disclaimer: This page was created after the hackathon's completion.</i>
    </p>

    <script src="lib/jquery-3.3.1.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
    <script src="lib/bootstrap-4.3.1-dist/js/bootstrap.min.js"></script>

  </div></body>
</html>