Weekly Assignment:Paper prototype and Task analysis

At my work, I design the layout of booths for my exhibitor clients as per their choice, so a good look and feel is a must. While doing this assignment, I could totally relate to what I do. I used PowerPoint to make the images and animated it, as I am very comfortable with power point from the very beginning.

I decided to use green power button icon color for start and thumbs up as “MISSION ACCOMPLISHED” as sign in the first and the last slides respectively. I have kept two modes “ATTACK MODE” and “PROTECT MODE” in red to perform two tasks. So depending on the circumstance Wonder Woman chooses one of them, and that turns green after clicking on it. I never want my user to go through a user manual before using the device, so I used all obvious images possible. Again for locating the target, I have kept two options for my user to select like the “GEO LOCATE TARGET” and “LOCATE TARGET” for two separate tasks. So for the first task, user gets the latitude and longitude coordinates from the device( i.e bracelet screen in this case) as  a pop up. While for the second task, user herself puts the inputs by selecting “NEAR” or “FAR” depending on the position of the enemy/target. Now when the device is able to locate the target successfully, it gives a pop-up to Wonder Woman saying-“TARGET LOCATED” and automatically comes the “EXECUTE” button ready to be clicked. So for this I have kept all the colors too vibrant, in contrast to help Wonder Woman chose them as fast a s possible, because there is no time when enemy is just in front of you and if you don’t attack, he will attack you.

For typography, I used icons that are easily recognized, as the screen size is also quite small almost as the same size of the bracelet, it should not take Wonder Woman much time in identifying on which screen she is on and what are her next steps. I used as less icons as possible to make sure the screen does not gets overloaded with features.Overall, I wanted to go with a modern, clean, and simple look to make it as easy to use as possible

I feel very happy that the V1 and V2 of my low fidelity prototype are quite similar to each other, except for very minor changes.So what I found after V1 of low fidelity prototype is that my my screen was too small, making it nearly impossible to read whats on it. But in my V2 I made it much bigger taking almost the whole surface of the bracelet.The images of V1 and V2 are attached hereby.

v1-  click here

v2 – click here

Moreover in version I kept a lot of options for Wonder Woman to actually type in all the commands she wants to tell the screen like “Reflect the Bullets” but in V2 I kept icons for choosing the required action. I did this because I understand after doing ROLESTORMING that when your enemy is standing in front of you and you not sure that how and when he will attack you, you have to play defense in order to protect yourself or else you need to attack fast to make sure you are not dead.

I think I can use this technology in my writing as in I used to be a writter few years back, so I find long paragraphs and whole lots of text to be boring and tiring for eyes as well at times. So instead of that if we had pictorial representation instead that would have attracted a lot more customers, we all have the child still alive within us, so we all must have noticed how children get attracted towards colorful photos, and are less keen in reading long stories.  So if images, pictures, photos can say it well, life would have been much better.

The task analysis being done using draw.io and can be accessed in the below link

http://i.imgur.com/Thldw2y.png

 

 

 

 

 

Medium Fedility Prototypes with Power Point(Due3/9)

Please note: All the power points are in BOX.
I have used InVision for my version 1 of my second medium fidelity prototype. This works pretty similar to  PowerPoint animation. InVision is an online prototyping tool that allows people to input “hotspots” onto designs so users can go in between pages with options  like click and hover.It is available online, either we can use this prototyping tool online  or download an offline html page that is accessable without internet, and the account was quick to create and free.  Despite the similarity I found it was easier and faster to create animations between the different pages.I used the features like hover and click to make my screen more real. I was also able to add transitions that allowed the user to go back if they selected cancel. The one disadvantage I found for this prototyping tool (compared to PowerPoint) was that inability to animate.  For the prototype I used the images I created for my version 2 of last project that were mainly icon based.One thing I loved about InVision, that would be helpful when sharing prototypes with large groups of people, was their comment and history function. Anyone who has access to the project can comment anywhere on the image. This could save time when collaborating and also keeps a record of the interaction that happens between team members. I also liked how they kept a record of what was uploaded and when. This really helps if many people are altering a prototype and something accidentally gets saved over.

Weekly Reading(Due 3/9)

Silk (a interface prototyping tool) is this week’s reading topic  where the author talks about this tool which allows users to sketch their designs and the system automatically turns them into working prototypes. This paper goes back to 1995, when you had to code a mock up of your user interface in order totes it. Although much of what they talked about does not seem revolutionary now, back in 1995 this must have been a major breakthrough. The tool allows you to draw widgets, like a scroll bar, and then the system uses an algorithm to build an actual working interface. Although the application does not allow you to create new functionality, it utilizes all of the common widgets found in an interface of that era.In 1995, this was probably a great idea. There were very few interfaces and very few widgets to keep track of. Today, it would be hard to implement something like this because user interface design is limitless. This being said, the overall idea can be see in prototyping tools today. You can see this kind of thinking with products like POP app and others that use sketches to create the interface.

Weekly Inspiration-UI Builder(Due-3/9)

 

Right now, I’m working on a project that’s heavy in UI elements and this was really helpful. It really did make my work much quicker & easier and give me time for creating the actual design, instead for wasting it on sliced sprites. Personally, I’m a fan of modern-looking flat UI & if you like this style too I’m sure you’ll be super happy with his asset. I wholeheartedly recommend it!

Another plus is that the UI templates included helped me a lot with 2D game design, which is a new thing for me and I’d really like to do it more in the future. I asked my friend (pro UI designer) how much he’d charge me for creating such elements and he said that for so many templates (design and implementation) he’d take $1k+. Wow! Now when I’m thinking I paid just 50$ for this asset I’m like – if you ever thought this was a lot – think TWICE.

 

Reference:
https://www.assetstore.unity3d.com/en/#!/content/29757

Weekly Assignment-Medium Fedility Prototype(Due-3/2)

Medium Fidelity Prototype__V1

At my work, I design the layout of booths for my exhibitor clients as per their choice, so a good look and feel is a must. While doing this assignment, I could totally relate to what I do. I used PowerPoint to make the images and animated it, as I am very comfortable with power point from the very beginning.

I decided to use green power button icon color for start and thumbs up as “MISSION ACCOMPLISHED” as sign in the first and the last slides respectively. I have kept two modes “ATTACK MODE” and “PROTECT MODE” in red to perform two tasks. So depending on the circumstance Wonder Woman chooses one of them, and that turns green after clicking on it. I never want my user to go through a user manual before using the device, so I used all obvious images possible. Again for locating the target, I have kept two options for my user to select like the “GEO LOCATE TARGET” and “LOCATE TARGET” for two separate tasks. So for the first task, user gets the latitude and longitude coordinates from the device( i.e bracelet screen in this case) as  a pop up. While for the second task, user herself puts the inputs by selecting “NEAR” or “FAR” depending on the position of the enemy/target. Now when the device is able to locate the target successfully, it gives a pop-up to Wonder Woman saying-“TARGET LOCATED” and automatically comes the “EXECUTE” button ready to be clicked. So for this I have kept all the colors too vibrant, in contrast to help Wonder Woman chose them as fast a s possible, because there is no time when enemy is just in front of you and if you don’t attack, he will attack you.

For typography, I used icons that are easily recognized, as the screen size is also quite small almost as the same size of the bracelet, it should not take Wonder Woman much time in identifying on which screen she is on and what are her next steps. I used as less icons as possible to make sure the screen does not gets overloaded with features.Overall, I wanted to go with a modern, clean, and simple look to make it as easy to use as possible

I feel very happy that the V1 and V2 of my low fidelity prototype are quite similar to each other, except for very minor changes.So what I found after V1 of low fidelity prototype is that my my screen was too small, making it nearly impossible to read whats on it. But in my V2 I made it much bigger taking almost the whole surface of the bracelet.The images of V1 and V2 are attached hereby.

v1-  click here

v2 – click here

Moreover in version I kept a lot of options for Wonder Woman to actually type in all the commands she wants to tell the screen like “Reflect the Bullets” but in V2 I kept icons for choosing the required action. I did this because I understand after doing ROLESTORMING that when your enemy is standing in front of you and you not sure that how and when he will attack you, you have to play defense in order to protect yourself or else you need to attack fast to make sure you are not dead.

I think I can use this technology in my writing as in I used to be a witter few years back, so I find long paragraphs and whole lots of text to be boring and tiring for eyes as well at times. So instead of that if we had pictorial representation instead that would have attracted a lot more customers, we all have the child still alive within us, so we all must have noticed how children get attracted towards colorful photos, and are less keen in reading long stories.  So if images, pictures, photos can say it well, life would have been much better.