Skip to content
Snippets Groups Projects
Commit 69497c2c authored by AmyB's avatar AmyB
Browse files

last pushes

parent d9a3dcd3
No related branches found
No related tags found
No related merge requests found
Pipeline #
......@@ -135,7 +135,26 @@
Sad but true.</p>
<p>The hardest thing here was to start making an app without having the mock-ups ready. Whenever I had to make apps in the past we started out with a drawing, then a paper version,
clipped together with paperclips so that users could test it. The next stage was to photo shop it (you can make .gifs in photo shop and do animations), only then it would go to a
programming student (or if you'd have the skills, you'd do it yourself). Non of the tried out apps even talks or mentions it. So that's note number one for when we're making apps with
kids in the lab. </p>
<p>As we're talking about apps, I'd like to introduce <a href="https://pencil.evolus.vn/">Pencil</a>. I didn't use it this time to build the website as I started from a bootstrap. But I
did make sketches how how the Academy site would look like. Whenever I need to go to a client and have an interface ready, I'm using a combination of Inkscape and Pencil to make my
mock-ups. The cool thing about Pencil is that it has a lot of common devices and lets you prototype basically anything</p>
<p>One of app makers I tested was <a href="https://my.mobiroller.com/">MobiRoller. It works a bit like a CMS. It let's you pick pre-made interfaces and such and put them together. Reminds me very much about wordprss,
weebly, bootstrap... </a></p>
<a href="../img/week13/roller.png" data-lightbox="image-51" data-title=""><img src="../img/week13/roller.png" class="img-fluid"></a>
<span class="caption text-muted">MobiRoller</span>
<p>I goofed around for a while within the dashboard, but never liked what I saw. You get a lot of data, but barely see the app and how it looks like. The <b>idea</b> was to
adapt the app to tools that the kids for example already know. Much like a lot of labs are developing their own systems of giving access to machines.</p>
<p>A second site that I tried was the MIT app inventor. It caught my attention because of the looks. It looks exactly the same as the programming environment that we work with in the lab. </p>
<h6><a href="#">To top</a></h6>
<hr>
......
......@@ -87,6 +87,7 @@
<a href="#Title1">What do I want to do</a><br>
<a href="#Title2">Node.js and HTML</a><br>
<a href="#Title3">There is more</a>
</ul>
</p>
......@@ -101,6 +102,10 @@
<p>Why didn't the documentation come on earlier the? I preferred to focus on my final project, making something physical instead of code. And I don't feel like there is much to tell about
this week. So let's start the tour.</p>
<h6><a href="#">To top</a></h6>
<hr>
<h2 id="Title2" class="section-heading">Node.js and HTML</h2>
<p>For the final assignments I'm combining node.js server that reads out the data from my board with HTML. Because, in the end, the only thing that shows me my foxy/kitty picture is
<b> a HTML page that runs in local host</b>. Nothing more than that. Explaining how HTML and css work feels obsolete after we've all build a website over the past 20 weeks. </p>
......@@ -112,11 +117,41 @@
<p>If the status is on, or high, the picture with open eyes will be shown. If the status is off, or low, the picture of the closed eyes will be showed. </p>
<a href="../img/week13/node.png" data-lightbox="image-51" data-title=""><img src="../img/week13/node.png" class="img-fluid"></a>
<span class="caption text-muted">First sketch of the Resistorbot</span>
<span class="caption text-muted">The code that makes the chat's head change</span>
<h6><a href="#">To top</a></h6>
<hr>
<hr>
<h2 id="Title2" class="section-heading">There is more</h2>
<p>I've always found technology fascinating, but coding and apps was never my thing. Even on my own phone, I have the most necessary apps and that's it. Banking apps are mess because of that
as they change codes if you're not active for 3 months. Now, what interests me about apps is how people use them. And what is the user centered design and psychology behind it. Not a
strange sidetrack as I majored in User Centerd Design (UCD) in design school. <p>
<p>My own 'app' on that point is pretty much messy and not even an app. Out there, on the internet there are a lot of (free) app makers. Or you can code one yourself. Keeping my kiddo's
from work in mind, I decided to test out some of those 'free' apps and see if they could be useful in the lab. In the end, we have moment where we have to shut down the internet because
the children are not concentrated on their challenge but on their phones. Yes, we also have the big see through box where all phones are being kept during workshops if it runs out of hand.
Sad but true.</p>
<p>The hardest thing here was to start making an app without having the mock-ups ready. Whenever I had to make apps in the past we started out with a drawing, then a paper version,
clipped together with paperclips so that users could test it. The next stage was to photo shop it (you can make .gifs in photo shop and do animations), only then it would go to a
programming student (or if you'd have the skills, you'd do it yourself). Non of the tried out apps even talks or mentions it. So that's note number one for when we're making apps with
kids in the lab. </p>
<p>As we're talking about apps, I'd like to introduce <a href="https://pencil.evolus.vn/">Pencil</a>. I didn't use it this time to build the website as I started from a bootstrap. But I
did make sketches how how the Academy site would look like. Whenever I need to go to a client and have an interface ready, I'm using a combination of Inkscape and Pencil to make my
mock-ups. The cool thing about Pencil is that it has a lot of common devices and lets you prototype basically anything</p>
<p>One of app makers I tested was <a href="https://my.mobiroller.com/">MobiRoller. It works a bit like a CMS. It let's you pick pre-made interfaces and such and put them together. Reminds me very much about wordprss,
weebly, bootstrap... </a></p>
<a href="../img/week13/roller.png" data-lightbox="image-51" data-title=""><img src="../img/week13/roller.png" class="img-fluid"></a>
<span class="caption text-muted">MobiRoller</span>
<h6><a href="#">To top</a></h6>
<hr>
</div>
</div>
</div>
......
docs/img/week13/roller.png

196 KiB

0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment