// Pokemasters About and Reflection//

WEBSITE LINK: www.pokemasters.site90.com

ABOUT PAGE: www.notenoughcats.tumblr.com/pokemasters

  • NAME: ASHLEY HARPER
  • STUDENT NUMBER: N7459947
  • EMAIL: ASHLEY.HARPER@CONNECT.QUT.EDU.AU
  • UNIT CODE: KIB204 WEB INTERFACE DESIGN

WHAT IS POKEMASTERS?

POKEMASTERS IS A WEB MASHUP THAT AIMS TO CONNECT POKEMON LOVER’S INTERESTS THROUGH A MASHUP MARKETED TOWARDS OLDER GENERATIONS WHO GREW UP WITH THE BRAND. USERS ARE ABLE TO EASILY BROWSE THE LATESTS IN NEWS, FACTS, TRAILERS AND MORE. 

POKEMASTERS SHARES AND SOURCES INFORMATION FROM A RANGE OF SOURCES INCLUDING:

  • TWITTER
  • GOOGLE IMAGES
  • YAHOO PIPES
  • RSS FEEDS FROM NUMEROUS OTHER SITES (EBAY, BULBAPEDIA ETC.)
  • BOOTSTRAP

REFLECTION:

WITH MY EXISTING SKILL SET, I FOUND THIS UNIT QUITE CHALLENGING. FROM THE FIRST ASSESSMENT I KNEW I WANTED TO DO A MASHUP ON POKEMON, NOT ONLY BECAUSE I AM A FAN, BUT ALSO BECAUSE I PERSONALLY HAVE NOT FOUND A SINGLE WEBSITE OR APP THAT I AM 100% FOND OF. THIS GAVE A LOT OF ROOM FOR INSPIRATION AS I WAS ONE OF THE CONSUMERS I WAS TARGETING.

LOOKING BACK ON THE ASSESSMENT IT HAS GIVEN ME MORE DRIVE TO INCREASE MY UNDERSTANDING OF HTML, CSS, PHP AND JAVASCRIPT. I HAVE ALWAYS FOUND THE PROGRAMMING SIDE OF MY DEGREE REALLY INTERESTING, HOWEVER IT TAKES ME THAT LITTLE BIT LONGER. IN HINDSIGHT I WOULD HAVE DEDICATED BETTER TIME MANAGEMENT TO ENSURE POKEMASTERS WAS ABSOLUTELY FULL OF EVERYTHING POKEMON, AS RIGHT NOW IT JUST HAS THE MAIN ASPECTS.

YAHOO PIPES WAS A BLESSING IN DISGUISE YET EVEN A ROSE HAS ITS THORNS (TACKY, I KNOW). WHEN IT WANTED TO WORK (LINKS KEPT BREAKING WHEN I TRIED TO TAKE SCREEN CAPTURES *SIGH*), THE EXISTING PIPES CREATED BY USERS SAVED A LOT OF TIME. ANOTHER BLESSING IN DISGUISE WAS THE OPEN SOURCE BOOTSTRAP API. IT AIDED IN GIVING MY WEBSITE A PROFESSIONAL APPEAL (EMBEDDED JAVASCRIPT, JQUERY ETC.), AND MADE EDITING PAGES MUCH EASIER.

WEBSITE SCREEN CAPTURES:

Javascript image cycle looking good! *holds breath*

I really want to have a section called ‘Turtwig Trailers’ that expose Youtube aspects shown in one of Cassie’s tutorials. However at the moment this is seeming further out of my reach as I consider my programming skills and understanding VERY beginner level.

I really want to have a section called ‘Turtwig Trailers’ that expose Youtube aspects shown in one of Cassie’s tutorials. However at the moment this is seeming further out of my reach as I consider my programming skills and understanding VERY beginner level.

// Design Process//

So basically my design process has gone from:

  • Reblogging awesome minimalistic art
  • Presenting my posters and getting slightly owned (lol) for my 6 features, but constructive feedback for my POC.
  • Rough sketches, wireframes, pipes, mockups
  • Creation of art styles for peer review
  • Research to understand my target audience and the current web demands
  • Programming (slowly) like a turtle to make the site functional and overcome errors
  • TO A FUNCTIONAL MASHUP! :)

// 6 Features of Pokemasters//

All assessments have meaning so its important that my mashup relates to the first assessments of 6 new/awesome features of the web.

Relation to Six Important Features of Web Design

During the process of developing my Mashup, I made sure I always brought it back to the 6 most important aspects of web design that I identified earlier in the unit. 

1.  E-commerce: A lot of my feedback suggested I incorporate e-commerce. I have done this through use of Ebay pipes for plush toys and trading cards and images pipes for artist support sourced from pokemon rss forum threads.

2. Modern Layout: It is important that my website shows the amount of hours i’ve put in and doesn’t look rushed! A lot of modern layouts are easy to browse and have logical layouts that users are used to navigating. Pokemasters follows a centred information approach, keeping it simple.

3. Real Time News and Updates - A mashup job is to provide its user with up to date, relevant information. Pokemasters sources news and updates from logical yahoo pipes and the most popular Pokemon websites.

4. Mobile Device Compatibility - Through the use of Bootstrap, Pokemasters adjusts to fit the users screen which directly correlates to my target audience of pokelovers on the go.

5. Social Media - I want Pokemasters users to share what they like with their personal network, and in return follow my favourite Pokemon Twitter users!

6. Progressive Loading - I have captured this feature in spirit… To ease heavy page loads on users devices, information is logically separated throughout different tabs and pages to ensure the user does not become frustrated. However the information on the existing pages is not too simple, as to disrupt immersion through copious clicking navigation. 

// Accessibility on Devices//

By using Bootstrap the web pages automatically resize to the size of device in use. This is extremely awesome for mobile device users!

These pipes include: latest news and updates from a range of pokemon dedicated sites and google/yahoo filters (Nuzleaf News).

The pipes in the second image: pipes for the slideshow images sourced from google images and community art (Igglybuff Images), plush and trading cards auctions sourced from Ebay rss feeds (additional content to website).

// Final Submission CRA requirements//

Progress Reporting:

Evidence of progress of your project work and engagement in the field of study and practice

·   Note all significant progress

·   Note any limitations experienced

·   Note any new relevant/influential research findings

Expected Outcomes

Formative: Post frequently on your Project Journals about the progress and problems encountered

Summative: Progress (draft of working mashup) to be presented to the tutor/class for feedback. Week 9.

Final Submission:

A website that presents data from multiple sources to improve a users access to and interaction with a service, event, product, group, etc.

Expected Outcomes

·   Formative: A final post on your project journal (tumblr) introducing, reflecting on and linking to your final web MashUp

·   Summative: Independent MashUp website. Week 12

60% Assessment Review

Notes on submitting Posts to your Project Journal

·   Use categories and/or tags to make it easy for others to read and find your posts relating to particular activities

·   Always link to your sources

·   Include image and text to best communicate a case study, your ideas, your progress etc

·   Always add your own commentary (or other peoples commentary) to communicate your interest, your response to, reason for including the post etc.

·   Most importantly… make sure your name is clear on the Journal… either in the header, footer or in a ‘contacts’ page.

·   Treat this journal as an opportunity to present your skills, knowledge and future hopes in a professional and public way… and to start making professional links with other practitioners, writers, researchers etc.

Note on Project Posters

·   These are A3 size presentations to report and present progress at each stage of project development.

·   You will prepare these presentations as a PowerPoint (or Keynote) slide… saved as an image for presentation in class… and submission to your Project Journal as key project milestones

Note on MashUp Website Submissions

·   Preferable (but not compulsory) to have an independent URL for submission. Otherwise you can use your public_html directory. But be warned that this QUT directory may not allow you to use the data sources you wish to.

·   Be sure to provide a link to the MashUp clearly on your Project Journal (Tumblr)

·   Be sure to include your name and email address somewhere visible on the website.

Assessment Criteria

Response to brief:   Design concept responds to the brief in a creative, imaginative and distinctive manner, clearly the result of an active and thorough exploration of the theme and design space. Clearly an original selection and sophisticated interpretation of data samples.

Depth of background analysis: Both formative activities and summative submissions evidence a deep and thoughtful analysis of available research sources and an active and critical engagement in related best practice.

Resolution of the concept:   The prototype clearly represents, evidences and communicates the intended concept, and exploits the design space in a unique, exemplary way. The work clearly communicates your intended interpretation of data in a meaningful and dynamic way.

Appropriate use of interface design principles:   The work evidences an exemplary degree of understanding of issues pertaining to interface and information design. Graphical components have been designed and composed in a way that contributes to the understanding of the data in a dynamic way.

Presentation and communication:   the presentation of materials insightfully contributes towards the communication of your design ideas, and those of your peers, in a distinctive and creative manner. 

// Pokemasters Art Style//

Due to popular demand, the art style I will be focusing on is the old school pixel/sprite Pokemon.

With Pokemon you can’t really go wrong. All Pokemon art in my opinion is colourful and conveys the right mood to its users. Well I guess maybe not some deviantart..


 

Ashley Harper | n7459947 | KIB204 | ashley.harper@connect.qut.edu.au | www.pokemasters.site90.com