-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
371 lines (368 loc) · 14.2 KB
/
index.html
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
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Service Bluepring – SKAT for stundents</title>
<link rel="stylesheet" href="semantic.min.css" media="screen">
</head>
<body>
<div class="ui container" style="padding-top: 20px">
<div class="ui grid">
<div class="middle aligned five wide column">
<h1 class="ui header">
Service Blueprint
<div class="sub header">International Students In Denmark</div>
</h1>
</div>
<div class="three wide column">
<div class="ui small image">
<img src="assets/images/logo.png" alt="SKAT Logo">
</div>
</div>
<div class="middle aligned four wide column">
<h4 class="ui header">
Legend
</h4>
<div class="ui list">
<div class="item">
<i class="mail icon"></i>
<div class="content">
Letter
</div>
</div>
<div class="item">
<i class="users icon"></i>
<div class="content">
Family and Friends
</div>
</div>
<div class="item">
<i class="phone icon"></i>
<div class="content">
Call Center
</div>
</div>
<div class="item">
<i class="home icon"></i>
<div class="content">
International House
</div>
</div>
<div class="item">
<i class="university icon"></i>
<div class="content">
Seminars
</div>
</div>
</div>
</div>
<div class="middle aligned four wide column">
<div class="ui list">
<div class="item">
<i class="at icon"></i>
<div class="content">
E-mail
</div>
</div>
<div class="item">
<i class="mobile icon"></i>
<div class="content">
SMS
</div>
</div>
<div class="item">
<i class="chrome icon"></i>
<div class="content">
Website
</div>
</div>
<div class="item">
<i class="facebook icon"></i>
<div class="content">
Social Networks
</div>
</div>
<div class="item">
<i class="calculator icon"></i>
<div class="content">
Tax Calculator
</div>
</div>
</div>
</div>
</div>
<!-- <h2>Persona in use</h2>
<div class="ui cards">
<div class="card">
<div class="content">
<img src="assets/images/personas/marco.png" alt="Marco" class="right floated ui mini image">
<div class="header">Marco <i class="br flag"></i></div>
<small class="meta">B.Sc. in Design and Innovation</small>
</div>
<div class="content">
<div class="description">
<div class="list">
<div class="item"><i class="icon man"></i>Male</div>
<div class="item"><i class="icon calendar"></i>21 years old</div>
<div class="item"><i class="icon road"></i>Århus</div>
<div class="item"><i class="icon heart"></i>Building blocks</div>
</div>
</div>
</div>
<div class="content">
<div class="description">
<p>
Marco has arrived in Denmark three weeks ago to study design for a three-year bachelor at the
University of Århus and in a couple of weeks he was able to find a job as a
<strong>student assistant at LEGO</strong> in Billund.
</p>
<p>
He is very concerned with his money.
</p>
</div>
</div>
<div class="content">
<div class="description">
It's the first time that Marco needs to use a tax system so the process and he
<strong>hopes that the process is as painless as possible</strong>.
</div>
</div>
</div>
</div> -->
<!-- <div class="ui grid">
<div class="middle aligned twelve wide column">
<h2 class="ui header">
The Tax Card creation blueprint
</h2>
</div>
<div class="right aligned four wide column">
<span data-position="left center" data-tooltip="Does not cover the creation of tax numbers nor the 2-year period rule." data-inverted="">
<i class="circular help icon"></i>
</span>
</div>
</div> -->
<table class="ui teal celled structured table">
<thead>
<tr>
<th></th>
<th>Aware</th>
<th colspan="3">Join</th>
<th colspan="2">Use & Develop</th>
<th>Leave/Repeat</th>
</tr>
</thead>
<tbody>
<tr>
<td><div class="ui blue ribbon label">Pre-Step</div></td>
<td>"I just got a job or at least I am thinking about getting one."</td>
<td colspan="3">"I got all the information I needed about how to join SKAT."</td>
<td colspan="2">"I got my tax card made and my preliminary assessment."</td>
<td>"I have full control and understanding over my tax process."</td>
</tr>
<tr>
<td><div class="ui green ribbon label">Step</div></td>
<td>
"I am getting all the information I need through the relevant
channels for me about how to join SKAT."
</td>
<td colspan="3">
"I am getting my tax card as well as my preliminary assessment done.
I am confident that the relevant information will be registered
after finishing the process."
</td>
<td>
<p>
"I am now able to make full use of the SKAT services. Usage doesn't
require much or any input from the customer. The information is the
same across all channels."
</p>
<p>
"This helps me understand my personal tax situation."
</p>
</td>
<td>
"I have the ability to go further in my use of SKAT. Developing
sufficient understanding of the tax system and finds ways how to
benefit from it. I fully understands the Danish tax system with all
the forms."
</td>
<td>
"I get my yearly statement. I only have a small disparity with my
tax amount and therefore get only a small amount extra to pay or I
get a small amount back."
</td>
</tr>
<tr>
<td rowspan="3"><div class="ui grey ribbon label">Channels</div></td>
<td rowspan="2">
<p>
Combination of one or more of the 6 options:
</p>
<p class="center aligned">
<span data-tooltip="Welcome to Denmark letter" data-position="top center" data-inverted><i class="big mail icon"></i></span>
<span data-tooltip="Family and friends" data-position="top center" data-inverted><i class="big users icon"></i></span>
</p>
<p class="center aligned">
<span data-tooltip="Seminars" data-position="top center" data-inverted><i class="big university icon"></i></span>
<span data-tooltip="Social networks" data-position="top center" data-inverted><i class="big facebook icon"></i></span>
</p>
<p class="center aligned">
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
<span data-tooltip="Call center" data-position="top center" data-inverted><i class="big phone icon"></i></span>
</p>
</td>
<td>
<p>Calling:</p>
<p class="center aligned">
<span data-tooltip="Call center" data-position="top center" data-inverted><i class="big phone icon"></i></span>
</p>
</td>
<td>
<p>Website:</p>
<p class="center aligned">
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
</p>
</td>
<td>
<p>International house (optional appointment):</p>
<p class="center aligned">
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
<span data-tooltip="SMS" data-position="top center" data-inverted><i class="big mobile icon"></i></span>
</p>
<p class="center aligned">
<span data-tooltip="E-mail" data-position="top center" data-inverted><i class="big at icon"></i></span>
<span data-tooltip="International house" data-position="top center" data-inverted><i class="big home icon"></i></span>
</p>
</td>
<td>
<p>Optional continued use:</p>
<p class="center aligned">
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
<span data-tooltip="Seminars" data-position="top center" data-inverted><i class="big university icon"></i></span>
</p>
<p>Announcements:</p>
<p class="center aligned">
<span data-tooltip="E-mail" data-position="top center" data-inverted><i class="big at icon"></i></span>
<span data-tooltip="SMS" data-position="top center" data-inverted><i class="big mobile icon"></i></span>
</p>
</td>
<td>
<p>New abilities:</p>
<p class="center aligned">
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
<span data-tooltip="Family and friends" data-position="top center" data-inverted><i class="big users icon"></i></span>
</p>
<p>
Feedback:
</p>
<p class="center aligned">
<span data-tooltip="Social networks" data-position="top center" data-inverted><i class="big facebook icon"></i></span>
</p>
</td>
<td rowspan="2">
<p>Announcements:</p>
<p class="center aligned">
<span data-tooltip="E-mail" data-position="top center" data-inverted><i class="big at icon"></i></span>
<span data-tooltip="SMS" data-position="top center" data-inverted><i class="big mobile icon"></i></span>
</p>
<p>Taxes adjusted:</p>
<p class="center aligned">
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
</p>
<p>Feedback:</p>
<p class="center aligned">
<span data-tooltip="Social networks" data-position="top center" data-inverted><i class="big facebook icon"></i></span>
</p>
</td>
</tr>
<tr>
<td colspan="3">
<p>Confirmation:</p>
<p class="center aligned">
<span data-tooltip="E-mail" data-position="top center" data-inverted><i <class="big at icon"></i></span>
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
</p>
</td>
<td colspan="2">
<p>Taxes paid:</p>
<p class="center aligned">
<span data-tooltip="Tax calculator" data-position="top center" data-inverted><i class="big calculator icon"></i></span>
</p>
</td>
</tr>
<tr>
<td colspan="7">
<p class="center aligned">
Always available:
</p>
<p class="center aligned">
<span data-tooltip="Social networks" data-position="top center" data-inverted><i class="big facebook icon"></i></span>
<span data-tooltip="Website" data-position="top center" data-inverted><i class="big chrome icon"></i></span>
<span data-tooltip="Call center" data-position="top center" data-inverted><i class="big phone icon"></i></span>
</p>
</td>
</tr>
<tr>
<td rowspan="5">
<div class="ui yellow ribbon label">Backstage</div>
</td>
<td>
Letter sent after registering for CPR
</td>
<td colspan=6>
SKAT Calculator
</td>
</tr>
<tr>
<td>
Advisors being trained
</td>
<td colspan="2" rowspan="2"></td>
<td>Appointment system</td>
<td colspan="3">
NemKonto link
</td>
</tr>
<tr>
<td>
Project management team working with school administration
</td>
<td>International House organization</td>
<td>Advisors being trained</td>
<td colspan="2" rowspan="2"></td>
</tr>
<tr>
<td colspan="4"></td>
<td>Project management team working with school administration</td>
</tr>
<tr>
<td colspan="7">
<p>
<strong>
Activities that run across all stages:
</strong>
</p>
<ul>
<li>SKAT CRM system;</li>
<li>Web designers and testing;</li>
<li>Automatic call center for screening and automatic callbacks and Call center employees;</li>
<li>Website hosting;</li>
<li>Service design team working from feedback.;</li>
<li>Interaction with Kommune and finance law about taxes to be paid;</li>
<li>AI chat database/software;</li>
<li>Customer help on facebook.</li>
</ul>
</td>
</tr>
</tbody>
</table>
</div>
<script type="text/javascript" src="assets/javascripts/jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="semantic.min.js"></script>
<script>
$('.ui.sticky').sticky();
</script>
</body>
</html>