Assignment 4 – Final Project

Assignment 4: Final Project, Major Studio 2

While applying for an internship, I was asked to give access to my Linkedin Profile to sign up. Following that, they parsed all my information based on what they needed. That made me think about the extent of information someone can access based on social login. Several questions came to my mind. These include:

  • How aware are we about information shared online?
  • How easy is it for someone to get access to your information?
  • What is the extent of access to user profiles through social media APIs?
  • How often do you use one user profile to login/sign up for another?
  • How can we physically represent social media existence?

While researching data representation, I realized that it all looked circular.

That reminded me of a dream catcher. The way a dream catcher filters our dreams, Big Data also filters structured and unstructured data available.

This slideshow requires JavaScript.

A dream catcher is a Native American concept and one of their most conspicuous symbols today. Carl Jung considers its an archetypal symbol and believes that through its contemplation, one can contemplate one’s self.

Big data is large volumes of high velocity, complex and variable data that requires advanced technologies and techniques to enable the capture, storage, distribution, management and analysis of information. One part of big data is social media analytics. It is the analysis of structured and unstructured data from social media. It is a small part of a lot of data.

Data representation is a convention for arrangement of things in the physical world in such a way as to enable information to be encoded and later decoded by suitable automatic systems. There are 2 types:

  • Analog representation – based on analogy
  • Digital representation – symbolic – finite symbols used

Thus, my research question is ‘Can physical representation of social media existence make users realize the negatives of social login?’. The concept statement is ‘I am creating a Internet of Things installation for social media users to realize the ease with which anyone can access their personal information and online activities in the context of the convenience of social login.’

For the same, I aim at using seven of the most popular social media sites:

  • Google+
  • Facebook
  • Instagram
  • Pinterest
  • Twitter
  • LinkedIn
  • Youtube

The idea is to take input from the user and light up a dream catcher based on the amount of information received. The digital representation in binary is symbolized by LEDs.

I started with working on the Facebook and Twitter APIs. The Twitter API works. However, the constraint with the functioning is that unless the username is inputted, it finds all the people with that particular name and lists them. While twitter still manages to give some information, the remaining APIs have moved from oAuth 1.0 to oAuth 2.0 which does not allow pulling of any information without authorized access by the user. As part of installation, it is not ideal, feasible or appropriate to ask a viewer to grant access six times. They would get annoyed and walk away.

The APIs are a bigger challenge than I anticipated.

  • Individual authorizations for every media are time-consuming and would push viewers away
  • The shift of APIs to oAuth 2.0 makes it difficult to pull data without user authorization
  • A new access token needs to be created to access every user account and they only last a few minutes
  • The amount and difficulty of coding required would not allow me to complete the project by the due date

Keeping these challenges in mind, I am looking at changing my idea and pursuing a new one.

This slideshow requires JavaScript.

To work on a new idea, I have had to move on from most of my domains. However, I still want to work with Internet of Things. Although I am not making a physical installation, I want to combine the idea of a physical device controlled by an app, which is the essence of IoT. Thinking about all the IoT possibilities, I did not want to work with home applications as that is a widely tapped market. Doing some more research, I realized that one of the least targeted markets is an IoT lock for a bag pack.

IoT locks exist for homes but not for bag packs. There are other ways of locking bags like:

  • Cable lock
  • Exomesh
  • Pad lock

Screen Shot 2016-03-20 at 7.54.31 PM.png

All these are external locks. They are limiting in multiple ways like pad locks can be used only with zippers, cable locks are long and exomesh fit only a certain style of bags. Mainly, they give away the fact that the bag contains something valuable. But what if there was a lock that was not visible to the eye? A lock that was internal and could be used on any bag? No new bag brand but a new bag lock. Thus, I want to create an Internet of Things lock for people to use with any kind of bag, which allows them control over the lock using a phone application in a way that can be used in their daily lives and not give away the contents of the bag.

Research Question

‘How can Internet of Things be used to create a better bag lock than the existing options?’

While researching further, I realized that my focus is not to replace the existing options. Instead I want to focus on adding to the options. Thus, I changed my research question.

‘Would an invisible lock, created using Internet of Things, be a viable option to secure backpacks?’

Concept Statement 

‘I am creating an IoT lock for bag users  to secure their backpacks and handbags easily and discreetly using a phone app in the context of public places.’

The focus of the project is on keywords:

  • discreet
  • easy
  • public places

Concept

Based off the concept statement, the concept is to create a physical device that can is invisible externally. Thus, there is a lock. But the lock functions on the inside of the bag. That is how the lock is ‘invisible’. It is discreet by not being visible to people. In other words, its ‘keeping honest people honest or rather dishonest people less dishonest’, as quoted by Morry Galonoy.

Domains

  • Physical security and access control

Physical security is security measures that are designed to deny unauthorized access to facilities, equipment and resources, and to protect personnel and property from damage or harm. Within physical security, the emphasis is on ‘alarm systems and sensors’ as the lock is to avoid theft without raising a finger at someone in a public space.

Implemented physical security means controlling access to personnel and property.  The only way to access the control is by providing the right key, in this case, using the app with the right 4-digit code. The lock is the barrier to access but the alarm in the lock lets you know that the control is working.

  • Internet of Things

Internet of Things refers to the networked interconnection of everyday objects, which are often equipped with ubiquitous intelligence. Such interconnection transforms the objects into smart objects that can understand and react to the environment. Similarly, BagLock is taking the concept of simple electromgnets and making them smart by allowing controllability of the magnets in the hands of the user to proctect their bag contents.

  • Product design

Product design presents an in-depth study of the structured design processes and methods. It is a set of activities that involves more than engineering. It is fraught with risks and opportunities, and it requires effective judgement over technology, the market and the time.  As BagLock is a new option for an existing market segment, it requires to be designed and presented in a manner that highlights its need and people accept it over other existing options.

  • Human centered design

Human centered design is based on physical and psychological needs of the human user, enabling the user to function at the highest level possible. The design has to enhance human abilities, overcome human limitations and foster human acceptance. BagLock highlights the need for discretion and easy use of locks in public places like crowded trains and subways or semi-private areas like cafes and libraries.

Process Update

This slideshow requires JavaScript.

Design and User Testing

To make this concept a reality, I started with branding the project first. Giving it an identity makes it feel more real than just a concept. Since the idea is to lock a bag, I have named it ‘BagLock’.

Then I went on to identifying the colors generally used to depict security. Based off the color psychology for consumers in the below image,  I initially decided to use green as the lock is to protect belongings considered ‘wealth’ metaphorically. However, while identifying the project domains, I changed the color scheme to blue. One of the domains is ‘Physical Security and Access Control’ and so Blue seems to be a more appropriate choice; with the color inducing ‘sensation of trust and security’.

The initial concept of the logo was a monogram in shades of green. But the first idea did not represent the idea as desired. I tried changing the structure of the monogram and added a zipper to give the feeling of a lock. But then realized that when the logo is minimized in size, the zipper looks like a blob. Then I moved on to making it look more like a lock and created the letter ‘B’ using lock handles inspired from Google cliparts of locks. But the green shades did not go with theme. And then I changed the color scheme to shades of blue to play on the ‘trust and security’ psychology of the color.

logo-options

The logo I am using for the project is  baglock-logo

METHODOLOGY

The research for the product was divided into 3 parts.

  • Part 1 – Survey questionnaire
  • Part 2 – User test paper prototype of the app
  • Part 3 – User test digital wireframes of the app

The survey questionnaire[1] contains questions regarding the users’ demographic information, current interest in physical security for backpacks and potential interest in a product like ‘BagLock’. The form was created in ‘Google Forms’ and distributed over social media to receive feedback on the possibility of acceptance for the said product. Five responses were recorded and used to derive a conclusion. The questionnaire did not focus on the app. It aimed at the researching people’s need and desire for such a product.

The second research phase was user testing the paper prototype of the app. The proposed layouts for the app were sketched on paper and cut out, as they would actually appear on the phone. The participants were identified from my friends and family based on the predefined user behaviors. They were not given any specific tasks but were asked to think aloud as they navigated through it. The app contains a limited number of pages, mainly four, so the focus was to see the learnability of the app if they were to actually use it. As the participants clicked or swiped on paper, the page would manually be swapped for the next one. Their interactions, mainly hand movements and gestures and vocal thoughts, were recorded to analyze and improve on existing designs. Responses of six participants were recorded for the next iteration.

The third phase included creation of digital wireframes[3]. Based on suggestions and user responses in the second phase, the digital wireframes were created in Adobe Illustrator as a guideline for the specifications of the actual app. The wireframes were shown to a single participant. The main purpose of the wireframes was to be used as a base for developing the app rather than redesigning the interaction.

The final user test will be conducted as the fourth phase[4]. This phase will occur after the app and physical product have been developed for functionality. The application will be developed as website that interacts with the lock over Wi-Fi using a Raspberry Pi. Based on an instructions sheet, participants will be asked to install the lock in their bag and run the app on their phones. This will provide an opportunity to make the final tweaks for the product to be ready.

PARTICIPANTS

PHASE 1: RESEARCH QUESTIONNAIRE

Attachment A includes the questionnaire used

Survey for Bag Locks

Number of participants: 5

Location: Online, through social media using Google Forms

Age group:

Age Number of Participants
18 to 24

1

24 to 30

2

30 to 35

1

Above 35

1

 

Current use of locks:

Lock to secure backpacks Number of Participants

Yes

3

No

2

 

Potential use of externally invisible lock:

Lock to secure backpacks Number of Participants

Yes

3

No

Maybe

2

 

Use an app to control a backpack lock:

Use an app Number of Participants
Yes

3

No

1

Maybe

1

 

PHASE 2: PAPER PROTOTYPE

Attachment B includes the paper prototype:

Number of participants: 6

Location:

  • D12, Parsons School of Design

Age of Participants:

Age Number of Participants
18 to 24

1

24 to 30

3

30 to 35

1

Above 35

1

 

Successful interactions:

Interactions

Yes

No

Enter code and press submit

6

Swipe the zipper up to lock

6

Swipe the zipper down to unlock

6

Swipe to pull menu down

2

4

Swipe to push menu back

2

4

Click on settings in menu

6

Tap on options in settings for dropdowns

5

1

Adjust volume in settings using range

6

 

PHASE 3: WIREFRAMES

Attachment C includes the wireframes:

wireframes

Number of participants: 1

Location:

  • D12, Parsons School of Design

Interactions:

  • Showed the wireframes to get feedback on layout

 

RECOMMENDATIONS AND SUGGESTIONS

Based on the three user tests done, the following recommendations and suggestions were received:

Phase 2: Recommendations

  • An alternative for the pass code could be found to access the app. This would reduce the time taken to lock or unlock
  • The zipper is fun as all 6 participants enjoyed swiping it to lock or unlock
  • 3 out 6 participants expected a prompt to tell them what the zipper does
  • 4 out 6 participants expected a feedback once the zipper was pulled to the top of the screen
  • The options available in the ‘Settings’ were sufficient, as they would not change much besides the volume or tone of alert and probably the passcode.

Phase 3: Recommendation

  • The words used as prompt could be more playful and less direct, although the play on words should not be too indirect.

FINDINGS

  • 3 out 5 people were willing to try out a product like BagLock if it did exist
  • The participants appreciated the zipper interaction
  • Immediate learnability of the app was high as all 6 participants new how the interactions worked, although limited prompts would ease the process
  • 4 out 6 participants tapped the menu button to drop it down instead of sliding it to pull it down.

Attachment D includes screenshots of the actual app and sketches of the physical lock prototype:

Technology

There are two parts to the project.  The app and the physical lock. For the purpose of prototyping for the project, the app is developed in HTML5, CSS3 and JavaScript. Coding it as a website makes it easier to connect it to the physical object using a NodeJS server.

The technology fot the physical lock includes:

  • raspberry pi
  • electromagnet
  • transistor tip120
  • 9v battery

The first attempt was using a raspberry pi. But due to wrong wiring, the pi was spoilt.

The second attempt was using an Arduino and corrected the wiring and the circuit worked. The magnetism could be controlled using a digital signal from the Arduino to the electromagnet.

After one successful attempt, I replaced the Arduino with the RFduino to try using Bluetooth to control the magnet. However, for the RFduino BLE module to work with the web app, I do not have adequate technology. The other limitation is that the BLE module works only with certain pre-coded apps and devices. Thus, I am using the raspberry pi and Wi-Fi to control the magnet.

Final Presentation

This slideshow requires JavaScript.

Final Project Paper

Final Research Report for Major Studio 2 – project ‘BagLock’

 

 

Advertisements

Assignment 3 – Short Project 2

Assignment 3: Short Project 2, Major Studio 2

The prompt for short project 2 is “Spicy Space”. Each word has a lot of synonyms, with a few standing out particularly. Namely:

  • Spicy:
    • zest
    • lively
    • high-spirited
  • Space
    • extent
    • dimension
    • duration

These 6 words refer to ‘energy’ and ‘movement’ which signify ‘Kinetic movement’.

Kinetic movement has a lot of types, ‘interactive art’ and ‘stabiles’ being of interest to me. With the influence of ‘dadaism’ to the concept of space and spice, my theme speaks of human encroachment into the lives and lands of other creatures.

The idea is to create an interactive installation that is a combination of the mobile and stabile form of kinetic art. The base of the installation would be a city divided into 4 layers while the mobile is a bunch of houseflies. As the viewer moves closer to the installation, the city begins to rise layer by layer depicting the growth of places for people’s comfort while the increase in fluttering of the house flies shows the discomfort caused to them with the architectural development. The installation aims at making people feel empathetic towards other creatures whom they cause uneasiness to.

This slideshow requires JavaScript.

The idea of the installation emerged as being from the human perspective, giving the viewer a disgusting feeling seeing flies. Instead, taking the suggestion of the class, I would like to present the project from the creature’s perspective.

Further research, into creatures affected by encroachment, highlighted a certain specie of butterfly majorly affected among other creatures. The specie “Lange’s metalmark butterfly” is native to the Antioch Dunes at the southern end of the San Francisco Bay. It has been one of the most endangered species in the United States. It has declined from 250,000 in historic times to 45 butterflies in 2006. One particular fire in 1906 led to the beginning of their decline. This effect of one insignificant event has led to a significant decline in the butterfly population. Coincidently, this effect has been termed the butterfly effect.

Keeping the butterfly effect as the theme of highlighting human encroachment, my idea of an installation is modified from flies and cities to butterflies. I now intend to create an installation of a huge butterfly made up of a 100 or more smaller butterflies made from origami. This installation represents how numerous butterflies are one specie. I would then project the actual butterfly image onto this installation to show how the specie looks. When someone walks closer to the installation, the projection changes from the wings to skulls on the butterfly.

precedence1

This image has been the inspiration to the projection concept of the installation. I could not have found a better way of depicting the atrocities faced by this specie due to human activities.

The main idea of the installation is the butterfly effect, making people think about how their choice of walking towards the installation has taken the color from it. The same way actions we consider insignificant in our everyday lives have a huge impact on our environment.

IMG_0269

I am making the butterflies using origami. I experimented with 3 types of origami butterflies and asked about 8 people about their opinion as to which butterfly would they like to see in an installation. Based on their preferences I selected the center butterfly which most resembles the natural butterfly shape.

IMG_0268

I also tested multiple types of paper in terms of their weight, feel and look. Rice paper was the most appropriate option as it has a slightly grainy texture and is really light to hold. It gives the butterflies a naturally flowing appearance. The butterflies made are of two sizes. The big ones are about 11 inches and the smaller ones are 5.5 inches. In all, the installation has 75 big butterflies and 11 small butterflies, totaling up to 86 butterflies being used. The size of the installation is about 3 ft x 2 ft.

IMG_0295

The initial idea of the project was to hang the butterflies from an aerial suspension. However, due to time constraints and wanting to deliver a finished project, I modified it to be a wall mounting.

While the physical prototype is ready, the digital projection code is a combination of Arduino and Processing. The Arduino reads the ultrasonic sensor for proximity while Processing manipulates the projection. I am comfortable with the Arduino and the ultrasonic sensor. The challenge was to send the sensor data from the Arduino to Processing in order to manipulate the projected image. I tried two or three different codes before using the one I am now.

The projected images are:

The final projections:

This slideshow requires JavaScript.

The journey of understanding human encroachment led from H.E.L.L.O.C. to The Butterfly Effect.

This slideshow requires JavaScript.

The references are available in Bibliography.

Assignment 2 – Short Project 1

Assignment 2: Short Project 1, Major Studio 2

My proposal for the short project 1 is a book swapping website. There are multiple available options for this activity. However, all existing options have bad interface designs. In order to learn the aesthetics of design, I wish to redesign the interface using my web development skills.

This slideshow requires JavaScript.

After suggestions during class hours, I have reconsidered the trade of physical books and would like to know more about e-book trade. However, there are several legal and technical limitations in the transfer if e-books. Thus, I am continuing with the swapping of physical books.

In the process of swapping, a book can be taken from anyone and given to anyone else. It does not have to be an exchange limiting to two parties only. Also, the location is limited to New York City but I would like to extend it globally once the website is fully developed and running.

Besides identifying the process involved in book swapping I have also taken up to brand the website and developed logos for it. There are 2 iterations to check how the negative space looks.

According to a research conducted in 2008, there is no existing platform that incorporates the activity of book swapping and a forum for book lovers. Going through the examples of book swapping websites and book forums, I found the following problems:

  • Cluttered
  • Very text heavy
  • Difficulty in navigation
  • Unclear site maps

The design had to be  clean, easy to read and understandable for people of all age groups. For this purpose, I am using a combination of test and icons. The icons created to depict the process have been designed after research into the most common symbols use for them.

Old classics often have a maroon hardcover with black text. Off the classics came the color scheme for the website, the maroon being replaced by red for a more contemporary look. The font used is ‘Gothic’ sans serif to keep pace with the contemporary style of the website.

Thus, my project is to simplify the interface and show the potential for improvement for other such websites. The website is coded using HTML5, CSS3 and JavaScript.

This slideshow requires JavaScript.

The references are available in the Bibliography.

3 things

Assignment 1: 3 Things Presentation, Major Studio 2

This slideshow requires JavaScript.

Originally from a business background, I decided to change paths and take up what I love to do as a career.

I am good at:

  • paintings and illustrations
  • learning and teaching
  • web development and coding

I want to learn:

  • aesthetics of good design
  • physical computing and soft circuits
  • computing languages and software that I do not know

I want to create:

  • a physical installation as a critical design on current world problems
  • an educational platform to facilitate peer to peer learning and teaching opportunities
  • an internet of things based experiential speculative design in the realm of possibility