[update 9pm] Something went wrong with my code this afternoon. Spended 5 hours and skipped one class, still can't make it right.
I couldn't get access to database, which means I can't change item image from example.gif to actual picture. This disaster makes my project from 80% completion drop down to about 60%. no images for items, no snapshots and no demo video. I felt so exhausted these days and now it plus frustrated. [/update] [update 10:40pm] add some console.log() into the code, suddenly get all the images I want, but ingredients and nuitrition facts are gone.... weird strange [/update] [update 23:31pm] fix it finally [/update] [update 9:30am 2/7] I found it actually can run on Mac. update the article. [/update] PART 1 How to Install You need Qt Creator to run this demo application. Come here to get the latest version of Qt SDK. Then you should download my source code. Or see the attachment at the end of this page.
Open 'cs422p1final.pro' in Qt Creator. Choose 'no' for the pop-up dialogue.
Click the triangle at lower left corner to run. If display is not right at the first time, close the application and run it again. PART 2 What It Can Do
Users can use this application (when the implementation entirely complete) to fulfill following tasks (modified from course notes):
- Users are able to browse available items and get additional information on a particular item including an image of the item, the available number of the item, the price of the item, the ingredients with allergic and preference information, and nutrition facts about that item.
- Users are able to browse items by category (snacks, beverage, ice cream, coffee, candy, lunch, etc).
- Once users find what they want, they are able to buy it using credit card.
- Users can get price information in currencies they are familiar with and pay in those currencies.
- After purchasing, users will be lead directly to the machine in whose dispenser the food is lying.
- Users can save their favorite things and buy them very quickly, very straightforward. (Maybe later the application can learn and remember users preference itself)
- This application is targeting to global market with multiply languages supported. (Currently English and Simplified Chinese, later I'll add more)
- I value the feedback from my users, any user who has advice, compliant and feedback, can submit it through this application.
- Users can see the information about this application and love me.
PART 3 How to Use
I don't have much to say about usage because it is very self-intuitive. But in case you can't run my application...
 The interface is divided into three sections.
The left one is to choose category and enter setting menu.
Temporarily, the categories are: favorite, all, snack, beverage (exclude coffee), ice cream, coffee, candy, others.
The middle one is a list of items in chosen category, including name, image, number and price.
you can buy stuff directly in here by clicking the 'buy' button.
you can add items you love to 'favorite' or move them out by clicking the 'star' button.
drag up and down to slide.
The right one is detail information of chosen item, including name, image, nutrition facts, ingredients and price.
you can check nutrition facts and ingredients information of chosen item here.
you can check allergic advice in 'ingredients'.
ingredients and nutrition facts are slide-able.
you can also buy stuff here by pressing the 'buy' button.
If you buy something without a credit card, the application will redirect you to the credit card setting page to provide it information about payment method.  If you buy something unavailable - although unavailable items will not be displayed on the list but due to concurrency issues, this may happen sometimes, the application will say sorry to you.
 After you buying stuff successfully, the application will tell you how to get to the vending machine by showing you a map (in the future. Now it will only give you a message box to tell you where to find your stuff).  In setting menu, you can
change language and currency,
currently, you need restart the application to make that happen, I've been debugging this for long, but still can't fix it at this time.
the quantity of price will change using current exchange rate.
add credit card information,
including card holder name, card number, exp. date, security code and your address information along with contact information.
currently it support only one card.
submit feedback, and
check information about this application.     PART 4 Why It Is Good
Despite that the implement is not as beautiful as I imagined at first time, but the design idea itself is still flaring.
First of all, the screen divide into 3 sections, other than use some 'hide automatically' interfaces.
Second, I provided as many as possible functions directly in the screen, so that users can go to any function from any page in no more than two clicks.
Third, the default category in left frame is 'FAVORITE', which let frequent users can even buy what (s)he bought frequently within just one click
Fourth, the layout is comfortable with user customs. Generally, users just operate from left to right to buy stuff.
Fifth, I pay a lot of attention on details. Detail makes perfect. I'm proud of the details of every product of mine.
For example, I decided (but not yet) to add animations to 'language' in Setting menu to rotate this word in different languages so that people can find where to change languages even under other languages.
PART 5 What I Learned
Well, I don't have enough time to implement the product as I imagined during design phase, not mention to make it perfect.
For example, the left section was suppose to display icons, not text, like this:
Although there are so many pities in this project, I think I've got enough experience this time, both in designing and playing Qt and QML. I'm looking forward to creating a really kick-ass magic mirror in project 2. |
CS422 >
