IVDE JIA NING by https://padlet.com/jianingchua98/jn Made by jn en-us 2017-04-18 05:44:25 UTC 2025-12-19 09:03:51 UTC hello@padlet.com https://padlet-assets.s3.amazonaws.com/icons/Alarmclock.png Tutorial 1 Activity 1: jianingchua98 https://padlet.com/jianingchua98/jn/wish/166677296 What is Interaction Design?

Interaction design is a process in which designers focus on creating engaging web interfaces with logical and thought out behaviors and actions. Successful interactive design uses technology and principles of good communication to create desired user experiences.

Describe how it is different from information architecture, product design and visual design.
 Information architecture focuses on several things,  target audience, software used on the website, existing data and how it will be represented.
In other words, information architecture is the creation of a structure for a website, application, or other project, that allows us to understand where we are as users, and where the information we want is in relation to our position. Information architecture results in the creation of site maps, hierarchies, categorizations, navigation, and metadata.

Interaction design focuses on the behavior of individuals using a product, but product design encompasses the entire range of research, concept, and execution and testing of a product. Product design includes interaction, visual, UI and UXdesign.

Visual design is the understanding of aesthetic appeal and impact of an entity with which individual interacts/looks at.



]]> 2017-04-18 05:57:30 UTC https://padlet.com/jianingchua98/jn/wish/166677296 Tutorial 1 Activity 2: jianingchua98 https://padlet.com/jianingchua98/jn/wish/166678957
Understand the interaction design process that you should adopt in embarking on a mobile application project.

Focus on users through the design process
Users are involved through the design process from the identification of needs to the evaluation of designs

Specific usability and user experience goals
Usability and user experience goals are identified early in the design process and used to evaluate designs

Iteration of the design process
Interaction design is an iterative process that allows designs to be refined in response to user feedback

 Identifying needs & establishing requirements
Needs and requirements are identified at the start

Developing alternative designs
Developing conceptual and detailed designs

Building interactive versions of the designs
Interactive versions are used to evaluate designs

Evaluating designs based on user feedback
Evaluation based on observation, questionnaires, etc.

Users vs Stakeholders
Users: people who will directly interact with the design.
Stakeholders: people who will be affected by the design.
What do the users need to do?
Although it is tempting for a designer to design what they would want but a good designer is able to design for the needs of the users of a product.

Different types of requirements:
Functional: what should the product do?
Data: what types of data should the product handle?
Environmental: physical/social/organisational/technical
User: characteristics of the target user group
Usability: important usability goals and measures

Techniques for Gathering
Data Questionnaires: useful for asking specific questions from a number group of people, questionnaires are often combined with other techniques.
Interviews: useful for exploring issues that arise as the result of asking questions, but they are time-consuming .
Focus Groups: good for gaining a consensus view of an issue and/or highlighting areas of conflict/disagreement.
Observations:shadowing people as they work with a system can provide important insight into what people actually do (compared to what they say they do).
Studying Documentation: existing documentation can be a good source of information about user activities.

Create a persona
Scenario
Prepare an informal narrative description of a user performing a task that allows the exploration of the context, needs and requirements.
Case
A description of how a user (actor) would interact with a system to achieve a task, allowing the description of the interactions required throughout.
--> Tell a short story about how someone would use your application in their everyday life.

Conceptual Design
Conceptual models for products that describe what a product should do and how the product should behave.
Detailed Design
Detailed models for products that describe aspects of an interface, e.g. colours, sounds, images, icons, menus, etc.

]]> 2017-04-18 06:20:59 UTC https://padlet.com/jianingchua98/jn/wish/166678957 Tutorial 1 Activity 3: jianingchua98 https://padlet.com/jianingchua98/jn/wish/166679094
Personality test
https://discpersonalitytesting.com/free-disc-test/ 

Results:
https://discpersonalitytesting.com/free-disc-test/show-work-results/

Selected group members:
Jia Ning I/S
Vivian C/SD
Nikki C/D]]> 2017-04-18 06:22:54 UTC https://padlet.com/jianingchua98/jn/wish/166679094 Tutorial 1 Activity 4: jianingchua98 https://padlet.com/jianingchua98/jn/wish/166680301
What are the new consumers expectations?
Consumers expect data to be at companies’ fingertips – from accurate stock information to delivery dates and customer records. And with this wealth of data and the technology to support it, consumers often feel like there’s no excuse for getting it wrong.

From self-checkouts to FAQ pages and call center IVR, consumers are more willing than before to try to solve their problems themselves.
This doesn’t mean that they no longer want to call and talk to a real person, but it does mean that through clever use of self-service tactics, contact centers can save time and money.

While 24/7 call centers may not be possible, consumers expect longer opening hours and weekend support.

Now that online service is mainstream, it seems wrong to pay for something like delivery – consumers now want free next day delivery as standard.

All aspects of your customer experience should therefore be mobile-friendly – from your website to your customer service. Mobile shopping and service is no longer an extra but a necessity.


 What is on-demand economy? 

Singapore is a shining example of this shift—just look at the success of homegrown apps GrabTaxi and Redmart. Ride-hailing app Grab has raised US$680 million in funding and is one of the leading on-demand services in the city. Meanwhile, Redmart, which has raised about US$60 million in funding, has seen wild success using the idea of delivering groceries right to the customer’s doorstep. It’s also grown by introducing food and shopping deliveries.

The progress of Singapore leading digital economy in the region is promising with the foundation of the Sharing Economy Association Singapore, to help promote the on-demand economy. Many startup companies are joining the organisation, as demand in Singapore for on-demand services rises. PandaBed and Airbnb have joined the organisation—along with carpooling apps CarPal and icarsclub. One of the biggest benefits this association is expected to bring to Singapore isn’t only ease and cheaper prices to customers, but sustainability that has become one of the country’s focuses.



Industry that have been disrupted are:
Dining
Apps like Seamless and GrubHub revolutionized the online food delivery process, enabling customers to browse menus, add discount codes and order dinner all with just a few taps.

Taxi/Transportation
Uber and Grab replaced the antiquated and largely reviled taxi system with a tech savvy service boasting virtual payments, driver reviews, trip cost estimates and more.

GPS navigation and maps
With Google Maps and Waze, mobile phones became our 24/7 personal navigators, making even the latest GPS system and physical maps obsolete.

Banking
With Venmo, it allows user to slip money to friends through the mobile device instead of splitting bills physically.

Fitness
Runkeeper, not only gives data about runs and workouts, they also made exercising fun and made it into games.

Books
Kindle and Audible allow user to carry hundreds of hardcovers within their digital devices.

Finance
Robinhood lets user trade stocks completely commission free via a mobile app.

Dating
With Tinder and OKCupid, instantly there are thousands of potential mate in just a few clicks away.

Photography
Instagram- take beautiful photos without expensive equipment.

Music
Spotify provides free streaming music anywhere anytime.

Communication/News
Twitter changed the way news is broken and covered making anyone capable of breaking the hottest stories.


]]> 2017-04-18 06:35:00 UTC https://padlet.com/jianingchua98/jn/wish/166680301 Tutorial 6 Activity 1 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177514713 level 3 t22  wednesday 3pm - 5 july consultation
Prototyping journey
Goals -> functionality -> develop -> evaluate
Refine Goals
Design with no technical constraints
Collaboration
Selling idea
selling video
user journey video
eg bike app
doesnt have an app
next image seen tapping on the app
look happy
next image have bike
riding bike happily
without having to go to bike rental shop


Client A: ‘I have a tight budget and deadline, so I don’t understand why this extra step is necessary. We already talked about my needs for the site/app. Can’t you just take my ideas and build what I need?’
How would you answer this client that prototyping is important and necessary?

Ideas of a design can sometimes be a far cry from the real world which the actual product will be used.
Evaluate and test
Hence, prototyping is necessary because we are able to determine which aspects are worthwhile and which parts needs to be revised or discarded.
Clarifying production cost and issues
Additionally , it allows the design team to evaluate and test the product before throwing in tens of thousands in going into full production.
Selling
By having a actual working model similar to the actual product  which is cost-free, it is also easier to sell to potential customers as we are able to provide a demo of the product.
Patents
To see and evaluate which aspects of the product is unique from other companies which patentable. Also, to sit down and check if any aspects of the product violates patents of other similar products on the market and make changes accordingly. To avoid unnecessary lawsuits.

To answer client A: You mentioned that you have a tight budget and deadline to follow, that is why we should sit down to find out what do you really need in your site. If this step is omitted, you might end up spending all of your money on a site which turns out unsatisfactory. Meaning, the aspects which you thought you needed in your final site design as an idea was actually not necessary.
Hence, it will reduce the overall time and budget needed for the development and minimize the risks of falling short of the final product.


Client B: ‘What do I do with this thing? It’s just a grouping of boxes and lines and certainly does not look like a website/app. I also don’t like the gray. Where’s the color? And I don’t know what ‘lorem ipsum’ means; my site/app should be in English.
How would you respond to this client’s comments?

The grey scale wireframe only acts as a skeleton of your app features.
They will define how it will look like in terms of page (for a website) or screen (for a mobile app) layout, navigation scheme, element and content placement.
Wireframe design is very simple in style and it is highly recommended to avoid colors too. Everything should be done in grayscale not to distract a client or a developer from the main purpose of wireframes which is to approve a basic structure of pages or screens.

To answer client B:  The color will only be added at the graphics design stage not the wireframing stage so that it wont distract the client from focusing on the app layout.
 Additionally, if you discover some navigation or layout issues after graphic design is finished it is very difficult to correct on the spot. 'Lorem ipsum' can be removed and replaced with an english word if you  liked it after reviewing the prototype. It is only there to show as text.

Client C: ‘Ok, I understand the comparison to building a house. What else do you need from me? How do I know what to look at and when?’ ‘So what happens next?’ What would be your response to this client’s comments?

To answer Client C: I would need constructive feedback about which design aspects, app layout, the navigation scheme, and the placing of the various contents on every page.
The next stage to expect is that you will need to decide on the color scheme and graphics design of the pages of the prototype. Or any additional features you would like to include.

]]> 2017-06-27 05:51:53 UTC https://padlet.com/jianingchua98/jn/wish/177514713 Tutorial 2 Activity 1 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177574293  Identify one app that you use getting information/updating information online that you would not be able to perform on a website. From this app, list the category, features, what functions do you use and why, what you like about it as compared to other competitors. 

Grab & Uber. 
Both of these apps are meant to replace taxi hailing/booking. It is only available through mobile phones (via apps) for the users to communicate and book grab cars or taxis in advance at a lower rate.
It is not possible and definitely do not have an online feature. Its online website is only for interested Grab or Uber drivers to signup for an account. 

The functions i used from both apps are the GrabHitch and Grabshare, UberPOOL and UberX car booking and i like it so that as compared to standard taxis, it is way more affordable for students or even anyone. It is a great disruption to the taxi industry.]]> 2017-06-27 17:01:00 UTC https://padlet.com/jianingchua98/jn/wish/177574293 Tutorial 2 Activity 2 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177574803 Discuss in your group which target market you would want to build your app for. List down the reasons why. List out the reason why you would want to build the app. 

Our target market: Teenagers/Young entrepreneurs
Shop Name: DACUBE 
The shop sells trendy items and is affordable.
It is a shop which also rents small shop spaces to small startup shops.



Reason to build app:
It does not have an existing application.
It only has an website with little content.
Its layout and interface design is not well done.
Overall the website does not have an appealing user interface.]]> 2017-06-27 17:08:35 UTC https://padlet.com/jianingchua98/jn/wish/177574803 Tutorial 2 Activity 3 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177575073 Devise questionnaires to get a profile of the users.
Devise a strategy to go about the interviews.
Construct a user persona that represents your primary target audience.

Questionnaires:

Interview questions (owner): 
  1. What are your business objectives? 
  2. Who are your competitors (top 3)? 
  3. What are your goals? 
  4. When and how did DACUBE started? 
  5. What do you want to improve from your website? 
  6. Who are the primary contacts from your organization, and who has final approval on the project? Please list names, titles, email addresses, and phone numbers.
  7. Do you feel your current site promotes a favorable user experience? Why or why not?
  8. What specific areas of your current site do you feel are successful? Why are they successful?
  9. What shortcomings exist with the current site, and what three things would you change on the site today if you could?
  10. Have you conducted usability tests or gathered visitor feedback for your current site? If so, how long ago? Please include any reports or findings.
  11. How important is it to maintain your current look and feel, logo, and branding?
  12. What are the main reasons you are redesigning your site (new business model, outdated site, expanded services, different audience)?
  13. What are your primary online business objectives with the site redesign? What are your secondary objectives? (Examples include increased sales, marketing/branding awareness, and fewer customer service calls.) Please discuss both long- and short-term goals.
  14. What is the main business problem you hope to solve with the site redesign? How will you measure the success of the solution?
  15. What existing strategy (both on- and offline) is in place to meet the new business objectives?
  16.  Give basic demographics: age, occupation, purchasing habits. (Use as much detail as possible in profiling your target user. 
  17.  What are the key reasons why the target audience chooses your company’s products and/or services (cost, service, value)? 
  18. Do we need the nex/jcube merchant login on the app? (what is it for also)
  19. What is the item that is the most regularly bought by customers?
  20. How many customers do you usually have per day?
  21. How long does a customers spend in the shop?



Survey questions (for persona): 
  1. What do you usually buy and what is it for? 
  2. How often do you shop there?
  3. How long do you spend in the shop?
  4. How long do you spend online shopping? 
  5. Is the colour scheme appealing and user friendly?
  6. What do you like about the website?
  7. What do you not like about the website? 
  8. What suggestions do you have to improve the website? 




User persona:

]]> 2017-06-27 17:12:50 UTC https://padlet.com/jianingchua98/jn/wish/177575073 Tutorial 4 Activity 1 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177575651 User journey map (pain points):]]> 2017-06-27 17:19:14 UTC https://padlet.com/jianingchua98/jn/wish/177575651 Tutorial 3 Activity 2 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177575954  Create a project collaboration board to be advised by your tutor. (e.g. Trello, Google docs, Slack, etc)

Slack.com: https://1718s1-ivde-dbit2b21.slack.com/messages/C575SAMUK/

Discuss in your group the type of interview you will conduct, what tools you will use, what you want to get from the interview.

Strategy:
Types of interview we planned on using:

The Face-to-Face Interview
We will go down to to shop located at JAvenue, JCube,  Jurong East to conduct an face to face interview with both the owner/staff and customers who shop there in-store.

The Online-survey interview
We will make use of Whatsapp messages - send the questions to people in our circle of family and friends who have shop in DaCube before.
Another way is creating google or using typeforms.com to craft out survey questions.

Tools we planned on using:
Whatsapp
Google forms
Typeforms.com

Why conduct interview?
So that we know more about the pain points/ difficulties faced by the customers who are looking for certain information, understand the true needs in order to create the perfect application which can make information easily available to them.
Through these interviews, we will not make the mistake of creating the various functions based on our own assumption without validation. This way we can save time from having to keep changing our ideas and keep changes to a minimum and only make minor changes.

 Activity on Heuristics evaluation:
To do an analysis of my my chosen client's and competitor website analysis, i made use of the 10 usability heuristic, I find that the first most important area is to look at the
Aesthetic and Minimalist design because, when the user first enter the website page, that will be the first thing he or she observes visually. It is important to capture the audience attention first.

Another aspect is theUser Control and Freedom. It is important that user can undo and redo their actions. For example, a exit/cancel button to get out of the wrongly entered page. So that they do not have to refresh the entire website. User control and freedom is important because the user can have control of the navigation of the pages as well. and it supports the website in being more user friendly.

Another one is Consistency and Standards, as a user myself the moment i navigate in between pages, what i would not want to see is inconsistency, because it would confuse me so much that i would question myself why am i even in this website? I would then stop looking at the site already. Hence, it is also relatively important for the words used, fonts and overall look of various pages to be consistent and maintain the same standard to give the whole site a 'clean' look. On top, of that, it is also more comfortable to look at if the site is consistent.

Next, Error prevention and Help users recognize, diagnose, and recover from errors is also important to a website because there's bound to be a situation where a user encounter an error when on a site, and according to Error Prevention, it is important to either eliminate error-prone conditions which means preventing an error in the first place, or check errors for the user and present users with a confirmation option before they commit to any action. Lastly, following the Help users recognize, diagnose, and recover from errors,
it is important that error messages should be displayed in simple language with no codes, precisely indicate the problem, and constructively suggest a solution


]]> 2017-06-27 17:23:02 UTC https://padlet.com/jianingchua98/jn/wish/177575954 Tutorial 5 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177576252  a) Draw the sitemap for this app. (Use google apps to select a tool to draw) 
 ]]> 2017-06-27 17:27:56 UTC https://padlet.com/jianingchua98/jn/wish/177576252 Tutorial 5 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177576278 b) Draw one user/work flow for this app. (Use google apps to select a tool to draw)

]]> 2017-06-27 17:28:26 UTC https://padlet.com/jianingchua98/jn/wish/177576278 Tutorial 5 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177576313  c) Understand the Five Interaction Design Principles

]]> 2017-06-27 17:29:10 UTC https://padlet.com/jianingchua98/jn/wish/177576313 Tutorial 6 Activity 2 jianingchua98 https://padlet.com/jianingchua98/jn/wish/177576566 Link of pizza marvel app

https://marvelapp.com/3dae8gd/screen/30017168 ]]> 2017-06-27 17:33:04 UTC https://padlet.com/jianingchua98/jn/wish/177576566 Holiday Research (Week 7) jianingchua98 https://padlet.com/jianingchua98/jn/wish/177576839
What Exactly Is The 80/20 Rule?
The Pareto principle (also known as the 80/20 rule, the law of the vital few, or the principle of factor sparsity) states that, for many events, roughly 80% of the effects come from 20% of the causes. ... Pareto developed both concepts in the context of the distribution of income and wealth among the population.

By the numbers it means that 80 percent of your outcomes come from 20 percent of your inputs. As Pareto demonstrated with his research this “rule” holds true, in a very rough sense, to an 80/20 ratio, however in many cases the ratio can be a lot higher – 99/1 may be closer to reality.

It really doesn’t matter what numbers you apply, the important thing to understand is that in your life there are certain activities you do (your 20 percent) that account for the majority (your 80 percent) of your happiness and outputs.

You may have expected me to say that 20 percent of your activities produce 80 percent of your financial rewards, and that is true, there are probably a handful of activities you do each week that produce your income. You can definitely apply the 80/20 Rule to most aspects of your business or working life, however I believe your overall happiness and satisfaction are much better variables to focus on. Money certainly plays an important role in your happiness and your money is influenced by 80/20 relationships, but it is only a component that leads to your overall well being, which should be your primary concern.


History of 80/20
The 80/20 rule was originally observed by Italian economist Vilfredo Pareto, and the actual principle was named the Pareto Principle by Joseph M. Juran. ... The 80/20 rule asserts that approximately 80 percent of the effects generated by any large system are caused by 20 percent of the variables in that system.
Originally, the Pareto Principle referred to the observation that 80% of Italy’s wealth belonged to only 20% of the population.

Examples of 80/20
More generally, the Pareto Principle is the observation (not law) that most things in life are not distributed evenly. It can mean all of the following things:
  • 20% of the input creates 80% of the result
  • 20% of the workers produce 80% of the result
  • 20% of the customers create 80% of the revenue
  • 20% of the bugs cause 80% of the crashes
  • 20% of the features cause 80% of the usage
  • And on and on…

However, there's a common misconception that the numbers 20 and 80 must add to 100 — they don’t!
20% of the workers could create 10% of the result. Or 50%. Or 80%. Or 99%, or even 100%. Think about it — in a group of 100 workers, 20 could do all the work while the other 80 goof off. In that case, 20% of the workers did 100% of the work. Remember that the 80/20 rule is a rough guide about typical distributions.
Also recognize that the numbers don’t have to be “20%” and “80%” exactly. The key point is that most things in life (effort, reward, output) are not distributed evenly – some contribute more than others.

Why Is This Useful?
The Pareto Principle helps you realize that the majority of results come from a minority of inputs. Knowing this, if…
20% of workers contribute 80% of results: Focus on rewarding these employees.
20% of bugs contribute 80% of crashes: Focus on fixing these bugs first.
20% of customers contribute 80% of revenue: Focus on satisfying these customers.
The examples go on.
The point is to realize that you can often focus your effort on the 20% that makes a difference, instead of the 80% that doesn’t add much. Therefore, at the end of the day, you should focus on the minor details first instead of focusing on the 80% effects of those minor details, because its the 20% which makes up the 80%.

How to apply it in UX Design of an mobile application or website
The first step you need to take is to identify what your main purpose is in having a website. Your objective could be to promote a brand, to sell products or to get users to sign up for something. 
You need to list each element of the website that is directly contributing to reaching this objective. Also make a note of which elements are not helping very much in website conversions.
Keep refining your content by removing those elements that are not really necessary. The elements and pages that remain are the ones which are mostly responsible for supporting the primary objective of your website.
To help you with your application of the Pareto principle in web design, you should consider the processes of simplification, optimization, prioritization and analysis.

Importance of 80/20 in UX Design
All the advantages of applying the Pareto principle in web design will soon become obvious when you have given your website a makeover. 
User experience will be better, because the site will be simpler and will have fewer distractions. Page response times will be faster, and what is left on your website will be of better quality.

Benefits of using 80/20 in UX Design
  • Identify the top 20% of your current usability issues and feature gaps so you can fix them.
  • Keeping focus on the most essential aspects of your website ensures that most of your visitors can find what they need very quickly.
  • This in turn leads to higher conversion rates and more return customers for your brand.
  • A simpler, clean and straightforward user experience, free of distractions, barriers and frustrations.
  • We know that too much information can cause the inattentional blindness effect, leading users away from what they are really looking for on your website. If you want to avoid this and ensure a positive user experience, keep it simple and focus on those 20% of things that really matter for them.
  • The 20% of what you have left will be better quality and much more effective.

Book resources:
1. http://richardkoch.net/2013/08/the-8020-principle-and-92-other-power-laws-of-nature-the-science-of-success/

2. https://www.bookdepository.com/The-8020-Principle-Richard-Koch/9780385491747?redirected=true&utm_medium=Google&utm_campaign=Base1&utm_source=SG&utm_content=The-8020-Principle&selectCurrency=SGD&w=AF7JAU9SC1T96PA80C5PACCH&pdg=kwd-104399445939:cmp-711782081:adg-38776039578:crv-164053803561:pid-9780385491747&gclid=Cj0KEQjwp83KBRC2kev0tZzExLkBEiQAYxYXOkO_yy6bT7-6Cmf-LGTIDRKKNkeSxew3202FQTZ2AcYaApqA8P8HAQ

3. https://www.perrymarshall.com/8020-book/

Web resources:
1. http://www.investopedia.com/terms/1/80-20-rule.asp

2. http://www.designyourway.net/blog/inspiration/the-8020-rule-that-you-should-know-as-a-designer/

3. http://www.keepitusable.com/blog/?tag=8020-rule

4. http://www.keepitusable.com/blog/?tag=8020-rule
]]> 2017-06-27 17:37:09 UTC https://padlet.com/jianingchua98/jn/wish/177576839 user testing. week 12 (slack) jianingchua98 https://padlet.com/jianingchua98/jn/wish/178005016
in groups, identify a productivity app and ask one user (in your group) to perform a function.
-create and event, on 30th july, 6pm, event description, family dinner 
OR
find out the email of a lecturer 
OR
make a posting in SnapChat & limit the expiration time.
  
idea: 
record that user navigating and using the app to perform that function, record the time it took for the user.
you need the screen recorder and you need a phone camera.]]> 2017-07-04 06:58:33 UTC https://padlet.com/jianingchua98/jn/wish/178005016