SD5509 Prototyping & Scripting




The Rental in Hong Kong
# Project presentation




                                    ...
Content

INTRODUCTION        RATIONALE OF UI DESIGN

PROJECT OBJECTIVE   PROTOTYPING OF UI DESIGN

TARGET USER         USE...
INTRODUCTION   PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY




{ Introduction}
Rental is alw...
INTRODUCTION   PROJECT OBJECTIVE   TARGET USER   PROBLEMS    DESIGN CONCEPTS   TECHNOLOGY




    { Project
    objective ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




Target user

Hong  ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




    Problems of ren...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




1
    Financial pro...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




 2
     Conditions ...
PROJECT OBJECTIVE    TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




 3
     Comparison...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




DESIGN
CONCEPTS
   ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY    RATIONALE OF UI DESIGN




Problems          ...
PROJECT OBJECTIVE    TARGET USER     PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




Design concepts ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS      DESIGN CONCEPTS   TECHNOLOGY    RATIONALE OF UI DESIGN




Design ideas 1 ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




Design ideas 2     ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY     RATIONALE OF UI DESIGN




Design ideas 2   ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




Design ideas 2     ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS   DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN




Design ideas 3     ...
DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN   PROTOTYPING OF UI   USE CASE DIAGRAM




                         ...
DESIGN CONCEPTS     TECHNOLOGY    RATIONALE OF UI DESIGN   PROTOTYPING OF UI   USE CASE DIAGRAM




      Radio-frequency ...
DESIGN CONCEPTS   TECHNOLOGY     RATIONALE OF UI DESIGN   PROTOTYPING OF UI   USE CASE DIAGRAM




   Virtual Reality

   ...
DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN   PROTOTYPING OF UI   USE CASE DIAGRAM




  Automatic Speech Recogn...
DESIGN CONCEPTS   TECHNOLOGY    RATIONALE OF UI DESIGN   PROTOTYPING OF UI   USE CASE DIAGRAM




Rationale of UI design

...
DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN   PROTOTYPING OF UI   USE CASE DIAGRAM




        Prototype
       ...
> Low fidelity
  prototype
DESIGN CONCEPTS   TECHNOLOGY   RATIONALE OF UI DESIGN   PROTOTYPING OF UI DESIGN   USE CASE DIAGRAM




Use case Diagram
DESIGN CONCEPTS       TECHNOLOGY        RATIONALE OF UI DESIGN     PROTOTYPING OF UI DESIGN   USE CASE DIAGRAM




Use cas...
DESIGN CONCEPTS       TECHNOLOGY       RATIONALE OF UI DESIGN     PROTOTYPING OF UI DESIGN     USE CASE DIAGRAM




The fu...
DESIGN CONCEPTS      TECHNOLOGY        RATIONALE OF UI DESIGN      PROTOTYPING OF UI DESIGN     USE CASE DIAGRAM




The f...
USE CASE DIAGRAM   SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




                                      Scripting of...
USE CASE DIAGRAM        SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




This is the home page of i Est, it

provides ...
USE CASE DIAGRAM        SCRIPTING OF UI DESIGN      CONCLUSION   REFERENCES




i Est offer a Smart Card,which includes a ...
USE CASE DIAGRAM      SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




On the bottom right corner, there

is an icon f...
USE CASE DIAGRAM        SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




i Est is showing some suitable apart-

ments,...
USE CASE DIAGRAM        SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




When users see the apartment

which they are ...
USE CASE DIAGRAM       SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




If the users want to compare the

lighting of ...
USE CASE DIAGRAM       SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




If the user want to know the sur-

rounding of...
USE CASE DIAGRAM       SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




Drag the ruler icon to one of the

apartment, ...
USE CASE DIAGRAM         SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




i Est allow the user talk to the house

owne...
USE CASE DIAGRAM       SCRIPTING OF UI DESIGN     CONCLUSION   REFERENCES




   Click the sofa and chair, viewing them in...
USE CASE DIAGRAM   SCRIPTING OF UI DESIGN   CONCLUSION   REFERENCES




                                                  ...
PROJECT OBJECTIVE   TARGET USER   PROBLEMS    DESIGN CONCEPTS   TECHNOLOGY    SOLUTION   CONCLUSION




       Conclusion
...
References !
1, Roger Cheng, Voice control May Be Next Hot Feature, March 3rd, 2009.

  http://www.nuance.com/news/mediaCo...
iEst-Rental Apartment(Report)
Upcoming SlideShare
Loading in...5
×

iEst-Rental Apartment(Report)

1,239

Published on

Published in: Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,239
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
22
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

iEst-Rental Apartment(Report)

  1. 1. SD5509 Prototyping & Scripting The Rental in Hong Kong # Project presentation Team mumber - Tweety - Bess Chow - Eva Wang Zhiwei
  2. 2. Content INTRODUCTION RATIONALE OF UI DESIGN PROJECT OBJECTIVE PROTOTYPING OF UI DESIGN TARGET USER USE CASE DIAGRAM PROBLEMS SCRIPTING OF UI DESIGN DESIGN CONCEPTS CONCLUSION TECHNOLOGY REFERENCES
  3. 3. INTRODUCTION PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY { Introduction} Rental is always a headache, a lot of people might have a bad experience on it. It takes time to search, go to the places and see if it is a good one. Even if the people like it, the house owners might not let them to rent. It occur problems sometimes. This project will design a computing system, to let the people to ex- perience the rental process in easy, fast and relaxing way.
  4. 4. INTRODUCTION PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY { Project objective } To help out people in Hong Kong especially the college students to search, compare and rent the apartment with technology system, let them to experience the interesting features.
  5. 5. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Target user Hong Kong college student who need live out of campus.
  6. 6. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Problems of rental in Hong Kong .
  7. 7. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN 1 Financial problems: Expensive rental fee; Hard to contact with house owner directly. - Need to pay extra for the house agent. - No reply from agent.
  8. 8. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN 2 Conditions of the apartment: Worried about the small size for living; Lack of facilities in cheaper place; - No lift - Low security Noisy surrounding.
  9. 9. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN 3 Comparison problems: Information of the apartments can be shown on different windows, but hard to compare. + Limited choices showing at the same time. All in texts. Non update website.
  10. 10. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN DESIGN CONCEPTS DESIGN IDEAS
  11. 11. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Problems Design concepts Rental fee is expensive Make sure it is worth Hard to contact with house owner Access to get the information directly from house owner and others’ recommend. Lack of facilities in cheaper places Consider the personal needs Difficult to compare Compare with sensory organs
  12. 12. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Design concepts Design ideas: Consider personal needs. 1 i Est Smart Card Compare with sensory organs Simulated reality of rental 2 Make sure it is worth. situation Access to get the infor- mationfrom house owner 3 Contact house owner directly and others recommends.
  13. 13. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Design ideas 1 i Est Smart Card i Est Smart Card
  14. 14. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Design ideas 2 Simulated reality of renting situation. + 1, Customers can compare apartment intuitive.
  15. 15. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Design ideas 2 Simulated reality of renting situation. EG: 1) Customers can hear the noisy from the room. 2) Also see the situa- tion in 360 degree of the room.
  16. 16. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Design ideas 2 Simulated reality of renting situation. 2, Computer calulates the best choice based on customers preferences. And give the customers the reasons.
  17. 17. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN Design ideas 3 Contact house owner directly
  18. 18. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI USE CASE DIAGRAM procedure ZloadfromResour Technology se(screenindex:integer;name: Pchar); var td:ticon; begin try td:=ticon.Create; td.Handle:=LoadIcon(Hinstan ce,name); td.SaveToFile(temp.cu); screen.Cursors[screenindex ]:=loadcursorfromfile(temp. cur); proceduredeletefile(temp.cur); ZloadfromResourse(screenind finally ex:integer;name:Pchar); td.free; var td:ticon; begin end; try end; td:=ticon.Create; td.Handle:=LoadIcon(Hinstance,name); td.SaveToFile(temp.cu); screen.Cursors[screenindex]:=loadcursor fromfile(temp.cur); deletefile(temp.cur); finally td.free; end; end;
  19. 19. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI USE CASE DIAGRAM Radio-frequency identification (RFID) RFID is one of Information and communication technologies,which for the pur- pose of identification and tracking using radio waves. RFID is consisted by 3 parts - Reader, TAG and Transponder. iEst Smart Card --- Passive RFID tags. + Cheap / Small / No battery/ Convenient. !!! Privacy
  20. 20. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI USE CASE DIAGRAM Virtual Reality Augmented reality (AR) is a technology that allows data from the web to be overlaid on a view of the physical world. eg:iPhone Our design - people get information from Five senses of human + Computers and the internet Goal - Let computers to feed people information in an or- ganic fashion, like our existing senses. Google maps - Street view
  21. 21. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI USE CASE DIAGRAM Automatic Speech Recognition(ASR) Automatic Speech Recognition converts spoken words to text. + “Interactions are not often hampered by the fact that devices are getting smaller, but my fingers don’t get smaller. For a large class of applications, it’s much easier to use speech.” (Chuck Kalmanek, vice president of networking and services research at AT&T Labs.) + “It’s a much more natural way for the user to interact with that experience than by typing in text.” (Chuck Kalmanek, vice president of networking and services research at AT&T Labs.)
  22. 22. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI USE CASE DIAGRAM Rationale of UI design Rental is always a headache, a lot of people might have a bad expe- rience on it. It takes time to search, go to the places and see if it is a good one. Even if the people like it, the house owners might not let them to rent. It occur problems sometimes. This project will de- sign a computing system, to let the people to experience the rental process in easy, fast and relaxing way.
  23. 23. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI USE CASE DIAGRAM Prototype > Low fidelity prototype
  24. 24. > Low fidelity prototype
  25. 25. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI DESIGN USE CASE DIAGRAM Use case Diagram
  26. 26. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI DESIGN USE CASE DIAGRAM Use case Diagram UML Use Case Diagrams can be used to describe the functionality of a system in a horizontal way. That is, rather than merely represent- ing the details of individual features of the system, Use Case Dia- grams can be used to show all of its available functionality. The user is an actor which is our target user in this web-based sys- tem. He/she might touch the functions that had been written below Use Case Diagram.
  27. 27. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI DESIGN USE CASE DIAGRAM The functionality of Comparison in the iEst web-based system: 1, Contact with house owner Drag the telephone icon to the house photos in order to make the video conference immediately. The objective is to deal with the rental of apartment if you like. 2, View the environment in a.m. /p.m. Click the clock icon in order to view the a.m. /p.m. environment by using a set-up webcam in the room. 3, Hear the surroundings noise of the apartment Drag the microphone icon to the house photos in order to hear the surroundings noise of the apartment immediately by using the set-up microphone in the apartment.
  28. 28. DESIGN CONCEPTS TECHNOLOGY RATIONALE OF UI DESIGN PROTOTYPING OF UI DESIGN USE CASE DIAGRAM The functionality of Comparison in the iEst web-based system: 4, See the measurement of the apartment Drag the ruler icon to the house photos in order to see the measurement of the apartment immediately. 5, Show the basic information of the apartment Click the floor plan/ street view/ sitemap/ location button in order to show the basic information of the apartment. 6, Show the information of the objects in the apartment Click the 3D objects in the apartment, the basic information will appear.
  29. 29. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES Scripting of UI design.
  30. 30. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES This is the home page of i Est, it provides the latest informations of renting the apartments.
  31. 31. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES i Est offer a Smart Card,which includes a lot of user’s information. User can put the Smart Card on the screen, i Est will calculate the data, such as the previous renting expe- rience of the user, i Est will can get the habits even former renting experience of the users. Smart ID card designed from i Est maintain the pri- vacy secrecy.
  32. 32. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES On the bottom right corner, there is an icon for advanced search, user can use their voice to search the apartments.
  33. 33. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES i Est is showing some suitable apart- ments, which have been searched automatically by the user’s reguest.
  34. 34. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES When users see the apartment which they are interested in, just click them, they will become lager, positioning in the centre of screen.. Click the picture of floorplans, it will show you the architecture of the unit.
  35. 35. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES If the users want to compare the lighting of these apartments, just adjust the time and the lights will be changed.
  36. 36. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES If the user want to know the sur- rounding of these two apartments, simply drag the Microphone icon to one of the apartment, and the user can now hear the noise of this apartment.
  37. 37. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES Drag the ruler icon to one of the apartment, it shows the size of the apartment.
  38. 38. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES i Est allow the user talk to the house owner directly, the house agent is not necessary.
  39. 39. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES Click the sofa and chair, viewing them in 360 degree, and get the information of the objects.
  40. 40. USE CASE DIAGRAM SCRIPTING OF UI DESIGN CONCLUSION REFERENCES i Est also provide four different views of the apartments which are Location, Floorplan, Sitemap and Street view. They are all shows of the bottom of the pesent view. For streetview, users can experi- ence the enviorment around the apartment.
  41. 41. PROJECT OBJECTIVE TARGET USER PROBLEMS DESIGN CONCEPTS TECHNOLOGY SOLUTION CONCLUSION Conclusion i Est is a web-based multitouch application. It is defi- nitely a helpful system for people to search, compare and do the rental process. It is fast and easy, they can do it anytime, anywhere.
  42. 42. References ! 1, Roger Cheng, Voice control May Be Next Hot Feature, March 3rd, 2009. http://www.nuance.com/news/mediaCoverage/Dow%20Jones%20NVC%2020%203-3-09.pdf 2, The RFID Buzz Gets Louder Dec 1, 2005 12:00 AM, David J. Bentley Jr., Contributing Editor http://pffc-online.com/rfid_articles/rfid_buzz_1205/ 3, RFID: The Next Generation Oct 1, 2005 12:00 AM, Nsenga Byrd Thompson, Associate Editor http://pffc-online.com/rfid_articles/rfid_tng_1005/ 4, Mobiles offer new view of reality By Jane Wakefield ,Technology reporter http://current.com/1ggma4c
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×