-
Notifications
You must be signed in to change notification settings - Fork 0
/
vj.html
315 lines (282 loc) · 35.6 KB
/
vj.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
<!DOCTYPE html><!-- Last Published: Wed Apr 05 2023 15:19:03 GMT+0000 (Coordinated Universal Time) --><html data-wf-domain="designwhich.works" data-wf-page="6411e9d1f37f420d19d0b73f" data-wf-site="64063ff1ee43c64584bdaa11"><head><meta charset="utf-8"/><title>Vehicle Parking | Parth Pawar · Design</title><meta content="Vehicle Parking Parivar is an app for homeowners of VJ Real Estate and construction company that aims to be the face of VJ services to their homeowners after purchasing a house from VJ. My role as a UI/UX designer was to research current methods and propose a new system for helping homeowners select a proper parking spot using Figma, Framer, Sketch, Illustrator, and prototyping tools. The main challenge was to help the house owner understand the need for the layout of the society and make it an easy process for selecting the car parking spot." name="description"/><meta content="vj | Parth Pawar · Design" property="og:title"/><meta content="VJ Parivar is an app for homeowners of VJ Real Estate and construction company that aims to be the face of VJ services to their homeowners after purchasing a house from VJ. My role as a UI/UX designer was to research current methods and propose a new system for helping homeowners select a proper parking spot using Figma, Framer, Sketch, Illustrator, and prototyping tools. The main challenge was to help the house owner understand the need for the layout of the society and make it an easy process for selecting the car parking spot." property="og:description"/><meta content="vj | Parth Pawar · Design" property="twitter:title"/><meta content="VJ Parivar is an app for homeowners of VJ Real Estate and construction company that aims to be the face of VJ services to their homeowners after purchasing a house from VJ. My role as a UI/UX designer was to research current methods and propose a new system for helping homeowners select a proper parking spot using Figma, Framer, Sketch, Illustrator, and prototyping tools. The main challenge was to help the house owner understand the need for the layout of the society and make it an easy process for selecting the car parking spot." property="twitter:description"/><meta property="og:type" content="website"/><meta content="summary_large_image" name="twitter:card"/><meta content="width=device-width, initial-scale=1" name="viewport"/><link href="https://uploads-ssl.webflow.com/64063ff1ee43c64584bdaa11/css/pedro-matos-chaves.webflow.1e3ac6afd.css" rel="stylesheet" type="text/css"/>
<style>@media (min-width:992px) {html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2e3"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2f9"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fc2"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fc7"] {opacity:1;display:flex;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fe1"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdf"] {display:none;-webkit-transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdd"] {display:block;}}@media (max-width:991px) and (min-width:768px) {html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdc"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fd0"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fd6"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2e3"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2f9"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fc2"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fc7"] {opacity:1;display:flex;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fe1"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdf"] {display:none;-webkit-transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(19px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdd"] {display:block;}}@media (max-width:767px) and (min-width:480px) {html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdc"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fd0"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fd6"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2e3"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2f9"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fe1"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdf"] {-webkit-transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);display:none;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdd"] {display:block;}}@media (max-width:479px) {html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdc"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fd0"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fd6"] {display:none;opacity:0;}html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2e3"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="5e97acba-7687-31f1-ede2-243865f9f2f9"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fe1"] {-webkit-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdf"] {-webkit-transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(15px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);display:none;}html.w-mod-js:not(.w-mod-ix) [data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fdd"] {display:block;}}</style><!--[if lt IE 9]><script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js" type="text/javascript"></script><![endif]--><script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script><link href="https://uploads-ssl.webflow.com/64063ff1ee43c64584bdaa11/64063ff1ee43c63af4bdaa2d_pmc-light-favicon.png" rel="shortcut icon" type="image/x-icon"/><link href="https://uploads-ssl.webflow.com/64063ff1ee43c64584bdaa11/64063ff1ee43c67097bdaa29_pmc-webclip.png" rel="apple-touch-icon"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
.container {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 10px;
}
<style>
.grabbable {
cursor: move;
cursor: grab;
cursor: -moz-grab;
cursor: -webkit-grab;
}
.grabbable:active {
cursor: grabbing;
cursor: -moz-grabbing;
cursor: -webkit-grabbing;
}
</style>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-HQTDF0RPLD"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-HQTDF0RPLD');
</script><link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.css"
/>
<script src="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.js"></script>
<style>
.body {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
@media only screen and (min-width: 768px) {
.projectinfo{
column-gap: clamp(1.875rem, -24.8377rem + 44.9898vw, 15.625rem);
}
</style></head><body class="body"><div id="mouse" class="cursor-wrapper"><div class="cursor"><div id="mousedraw" class="mousedraw w-embed"><svg id= "mousedraw" width="20" height="20" viewBox="0 0 30 30" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M27.1316 12.1357H21.9109L25.604 8.44258C26.7213 7.3253 26.7213 5.51327 25.604 4.39193C24.4867 3.27465 22.6747 3.27465 21.5534 4.39193L17.8602 8.08505V2.8643C17.8602 1.28386 16.5804 0 14.9959 0C13.4155 0 12.1316 1.27979 12.1316 2.8643V8.08505L8.43852 4.39193C7.32124 3.27465 5.50921 3.27465 4.38787 4.39193C3.27059 5.50921 3.27059 7.32124 4.38787 8.44258L8.08099 12.1357H2.8643C1.28386 12.1357 0 13.4196 0 15C0 16.5804 1.28386 17.8643 2.8643 17.8643H8.08505L4.39193 21.5574C3.27465 22.6747 3.27465 24.4867 4.39193 25.6081C5.50921 26.7294 7.32124 26.7254 8.44258 25.6081L12.1357 21.915V27.1357C12.1357 28.7161 13.4196 30 15 30C16.5804 30 17.8643 28.7161 17.8643 27.1357V21.915L21.5574 25.6081C22.6747 26.7254 24.4867 26.7254 25.6081 25.6081C26.7254 24.4908 26.7254 22.6788 25.6081 21.5574L21.915 17.8643H27.1357C28.7161 17.8643 30 16.5845 30 15C30 13.4196 28.7202 12.1357 27.1357 12.1357H27.1316Z" fill="#FAFAFA"/>
</svg></div><div id="flag" class="flag"><div class="flagicon">🇺🇸</div></div></div><div class="w-embed"><style>
.cursor-wrapper {pointer-events: none;}
.w-webflow-badge {
display: None !important;
visibility: hidden !important;
}
</style></div></div><div style="display:flex" class="preloader"><div class="loadpill"><div class="loadtext loadtext1">Parth Pawar</div><div class="loadtext loadtext2">Multidisciplinary designer</div></div></div><nav class="navbar"><div class="navcontainer"><div class="navcontainerleft"><div class="navelementsleft"><a href="index.html" data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fbe" class="brand w-nav-brand"><div class="navlogo">Parth Pawar</div></a><a data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fc1" href="mailto:[email protected]?subject=Hello%20Parth!" class="calllink w-inline-block"><div data-w-id="12dd3abc-77c3-dcfb-2891-f9a729453fc2" class="callwraper2"><div class="callcircarrowdark w-embed"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="7" cy="7" r="7" fill="#FAFAFA"/>
<path d="M9.4404 5.69095L9.495 5.72735L9.4222 9.96795L10.8236 8.54835L10.769 3.37955L5.6002 3.32495L4.1988 4.72635L8.4394 4.65355L8.4758 4.70815L3.3252 9.85875L4.2898 10.8234L9.4404 5.69095Z" fill="#141414"/>
</svg></div><div class="callcircarrow w-embed"><svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.4404 5.69095L9.495 5.72735L9.4222 9.96795L10.8236 8.54835L10.769 3.37955L5.6002 3.32495L4.1988 4.72635L8.4394 4.65355L8.4758 4.70815L3.3252 9.85875L4.2898 10.8234L9.4404 5.69095Z" fill="#FAFAFA"/>
</svg></div>
<div class="calltext">Say hello, let’s talk</div></div><div data-w-id="fe5b308f-bf23-8ec2-1ba6-3219f31438ad" class="callwraper"><div class="callcirc"></div><div class="callcircdark"></div><div class="calltext">Available for work</div></div></a></div></div><div class="navcontainerright"><div class="navelementsright"><div class="navmenuwrapper"><div class="navmenu">
<a data-w-id="858e813e-8591-ded8-ed4b-fcd17293b44b" href="PDF" class="navlink w-inline-block"><div class="textwrapper"><div class="calltext calltextup">PDF</div><div class="calltext">PDF</div></div></a>
<a href="UserExperience.html" data-w-id="e5767539-47d0-cfcc-b041-75579a10a74f" class="navlink w-inline-block"><div class="textwrapper"><div class="calltext calltextup">UX</div><div class="calltext">UX</div></div></a>
<a href="Installation.html" data-w-id="e5767539-47d0-cfcc-b041-75579a10a74f" class="navlink w-inline-block"><div class="textwrapper"><div class="calltext calltextup">Installation</div><div class="calltext">Installation</div></div></a>
<a data-w-id="858e813e-8591-ded8-ed4b-fcd17293b44b" href="about " class="navlink w-inline-block"><div class="textwrapper"><div class="calltext calltextup">About</div><div class="calltext">About</div></div></a>
<div id="themetoggle" data-w-id="e7ca30d3-7116-385f-9fee-411d49090666" class="themetoggle"><div id="light" data-w-id="e7ca30d3-7116-385f-9fee-411d49090667" class="themetoggletext">Light</div><div data-w-id="e7ca30d3-7116-385f-9fee-411d49090669" class="themetoggletext2">Dark</div><div data-w-id="e7ca30d3-7116-385f-9fee-411d4909066b" class="themetogglecirc"></div></div></div></div><div data-w-id="9e348434-4a1f-9ad9-13af-9f9972a3bb73" class="plusbuttoncirc"><div class="circle"><div class="plusicon pluswhite w-embed"><svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<line x1="5.8999" y1="2.18557e-08" x2="5.8999" y2="12" stroke="#FAFAFA"/>
<line x1="12" y1="5.90002" x2="-4.37114e-08" y2="5.90002" stroke="#FAFAFA"/>
</svg></div><div class="plusicon plusblack w-embed"><svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
<line x1="5.8999" y1="2.18557e-08" x2="5.8999" y2="12" stroke="#141414"/>
<line x1="12" y1="5.90002" x2="-4.37114e-08" y2="5.90002" stroke="#141414"/>
</svg></div></div></div></div></div></div><div id="darkbar" class="navbarrectdark"></div><div id="lightbar" class="navbarrect"></div></nav><div id="luxy" class="smooth-wrapper"><section id="Project" class="project wf-section"><div class="projectcontainer w-container"><div class="projectdiv"><div class="projectinfo"><div class="projectinfoleft"><h1 style="-webkit-transform:translate3d(0, 40px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 40px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 40px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 40px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);opacity:0" class="projecttitle">Vehicle Parking</h1><div class="projectpills"><div style="-webkit-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);opacity:0" class="projecttag"><div class="pilltext">UI/UX Design</div></div><div style="opacity:0;-webkit-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)" class="projectyear"><div class="pilltext">2022</div></div></div></div><div style="opacity:0;-webkit-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 20px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)" class="projectinforight"><p class="projectparagraph">VJ Parivar is an app for homeowners of VJ Real Estate and construction company that aims to be the face of VJ services to their homeowners after purchasing a house from VJ. My role as a UI/UX designer was to research current methods and propose a new system for helping homeowners select a proper parking spot using Figma, Framer, Sketch, Illustrator, and prototyping tools. The main challenge was to help the house owner understand the need for the layout of the society and make it an easy process for selecting the car parking spot.</p></div></div></div></div><div style="opacity:0;-webkit-transform:translate3d(200px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(200px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(200px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(200px, 0, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0)"
class="imageslider"><div class="swiper"><div class="swiper-wrapper grabbable"><div class="swiper-slide fitcontent firstslide">
<style>
.container1 {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}
.image {
width: 98%;
height: auto;
max-width: 98%;
margin-right: 1%;
border-radius: 0px;
}
@media screen and (min-width: 500px) {
.image1 {
content: url(./Assets/Projects/vj/Mobile/1.jpg);
}
.image2 {
content: url(./Assets/Projects/vj/Mobile/2.jpg);
}
.image3 {
content: url(./Assets/Projects/vj/Mobile/3.jpg);
}
.image4 {
content: url(./Assets/Projects/vj/Mobile/4.jpg);
}
.image5 {
content: url(./Assets/Projects/vj/Mobile/5.jpg);
}
.image6 {
content: url(./Assets/Projects/vj/Mobile/6.jpg);
}
.image7 {
content: url(./Assets/Projects/vj/Mobile/7.jpg);
}
.image8 {
content: url(./Assets/Projects/vj/Mobile/8.jpg);
}
.image9 {
content: url(./Assets/Projects/vj/Mobile/9.jpg);
}
.image10 {
content: url(./Assets/Projects/vj/Mobile/10.jpg);
}
.image11 {
content: url(./Assets/Projects/vj/Mobile/11.jpg);
}
.image12 {
content: url(./Assets/Projects/vj/Mobile/12.jpg);
}
}
@media screen and (min-width: 800px) {
.image1 {
content: url(./Assets/Projects/vj/Desktop/1.jpg);
}
.image2 {
content: url(./Assets/Projects/vj/Desktop/2.jpg);
}
.image3 {
content: url(./Assets/Projects/vj/Desktop/3.jpg);
}
.image4 {
content: url(./Assets/Projects/vj/Desktop/4.jpg);
}
.image5 {
content: url(./Assets/Projects/vj/Desktop/5.jpg);
}
.image6 {
content: url(./Assets/Projects/vj/Desktop/6.jpg);
}
.image7 {
content: url(./Assets/Projects/vj/Desktop/7.jpg);
}
.image8 {
content: url(./Assets/Projects/vj/Desktop/8.jpg);
}
.image9 {
content: url(./Assets/Projects/vj/Desktop/9.jpg);
}
.image10 {
content: url(./Assets/Projects/vj/Desktop/10.jpg);
}
.image11 {
content: url(./Assets/Projects/vj/Desktop/11.jpg);
}
.image12 {
content: url(./Assets/Projects/vj/Desktop/12.jpg);
}
}
</style>
<div class="container1">
<img class="image image1" src="./Assets/Projects/vj/Desktop/1.jpg" alt="Image 1">
<img class="image image2" src="./Assets/Projects/vj/Desktop/2.jpg" alt="Image 2">
<img class="image image3" src="./Assets/Projects/vj/Desktop/3.jpg" alt="Image 3">
<img class="image image4" src="./Assets/Projects/vj/Desktop/4.jpg" alt="Image 4">
<img class="image image5" src="./Assets/Projects/vj/Desktop/5.jpg" alt="Image 5">
<img class="image image6" src="./Assets/Projects/vj/Desktop/6.jpg" alt="Image 6">
<img class="image image7" src="./Assets/Projects/vj/Desktop/7.jpg" alt="Image 7">
<img class="image image8" src="./Assets/Projects/vj/Desktop/8.jpg" alt="Image 8">
<img class="image image9" src="./Assets/Projects/vj/Desktop/9.jpg" alt="Image 9">
<img class="image image10" src="./Assets/Projects/vj/Desktop/10.jpg" alt="Image 10">
<img class="image image11" src="./Assets/Projects/vj/Desktop/11.jpg" alt="Image 11">
<img class="image image12" src="./Assets/Projects/vj/Desktop/12.jpg" alt="Image 12">
</div>
<footer class="footer wf-section"><div class="footercontainer w-container"><div class="footerdiv"><a data-w-id="5e97acba-7687-31f1-ede2-243865f9f2e2" href="mailto:[email protected]?subject=Hello%20Parth!" class="letstalkdiv w-inline-block"><div data-w-id="5e97acba-7687-31f1-ede2-243865f9f2e3" class="letstalkinnerdiv"><div class="letstalktext">Let's talk</div><div class="letstalkicon w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2 w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktext">Let's talk</div><div class="letstalkicon w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2 w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktext">Let's talk</div><div class="letstalkicon w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2 w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktext">Let's talk</div><div class="letstalkicon w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2 w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktext">Let's talk</div><div class="letstalkicon w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2 w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div></div></a><a data-w-id="5e97acba-7687-31f1-ede2-243865f9f2f8" href="mailto:[email protected]?subject=Hello%20Parth!" class="letstalkdivdark w-inline-block"><div data-w-id="5e97acba-7687-31f1-ede2-243865f9f2f9" class="letstalkinnerdivdark"><div class="letstalktextdark">Let's talk</div><div class="letstalkicondark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2dark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktextdark">Let's talk</div><div class="letstalkicondark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2dark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktextdark">Let's talk</div><div class="letstalkicondark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2dark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktextdark">Let's talk</div><div class="letstalkicondark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2dark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div><div class="letstalktextdark">Let's talk</div><div class="letstalkicondark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#141414"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#FAFAFA"/>
</svg></div><div class="letstalkicon2dark w-embed"><svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
<circle cx="40" cy="40" r="40" fill="#FAFAFA"/>
<path d="M53.944 32.52L54.256 32.728L53.84 56.96L61.848 48.848L61.536 19.312L32 19L23.992 27.008L48.224 26.592L48.432 26.904L19 56.336L24.512 61.848L53.944 32.52Z" fill="#141414"/>
</svg></div></div></a><div class="lastdiv"><div class="_2023div"><div class="lastdivtext c">©</div><div id="year" class="lastdivtext">2023</div></div><div class="lastdivtext love">Made with love</div><a href="caleidoscopio#Project" data-w-id="5e97acba-7687-31f1-ede2-243865f9f316" class="lastdivlink w-inline-block"><div class="lastdivtext">Go all the way up ↑</div></a></div></div></div></footer></div><script src="https://d3e54v103j8qbb.cloudfront.net/js/jquery-3.5.1.min.dc5e7f18c8.js?site=64063ff1ee43c64584bdaa11" type="text/javascript" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script><script src="https://uploads-ssl.webflow.com/64063ff1ee43c64584bdaa11/js/webflow.7d55ba7c0.js" type="text/javascript"></script><!--[if lte IE 9]><script src="//cdnjs.cloudflare.com/ajax/libs/placeholders/3.0.2/placeholders.min.js"></script><![endif]--><script>
history.scrollRestoration = "manual";
const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
const elementToHide = document.getElementById('mouse');
if (isMobile) {
elementToHide.style.display = 'none';
} else {
elementToHide.style.display = 'flex';
}
$("#themetoggle").click(function () {
if ($('#light').css('display') === 'none') {
localStorage.setItem("theme", "light");
} else {
localStorage.setItem("theme", "dark");
}
});
if (localStorage.getItem("theme") === 'dark') {
$('#themetoggle').trigger('click');
}
</script>
<script src="https://min30327.github.io/luxy.js/dist/js/luxy.js"></script>
<script charset="utf-8">
var isMobileLuxy = /iPhone|iPad|Android/i.test(navigator.userAgent);
if (!isMobileLuxy) {
luxy.init({
wrapper: '#luxy',
wrapperSpeed: 0.065,
});
}
</script><!-- Initialize Swiper -->
<script>
// Watch for changes in the window size
var mediaQuery = window.matchMedia('(max-width: 767px)');
mediaQuery.addEventListener('change', handleBreakpointChange);
handleBreakpointChange(mediaQuery);
document.getElementById("year").innerHTML = new Date().getFullYear();
.w-webflow-badge {
display: None !important;
visibility: hidden !important;
}
</script></body></html>