Monday, November 28, 2016

Week 13

Today I started coding my website. I really just made a basic layout based on my wireframe. I have each area colored differently so I could see if the code was actually working. If it was not the way I needed it, I would adjust accordingly.
 

 I might make this area smaller.





Friday, November 25, 2016

IIDCon

 I attended IIDCon on 11/19/16 which was a conference that included 4 speakers; Victor Yocco, Brian Crumley, Liese Zahabi, and John Halfpenny. The first speaker was Victor Yocco who is a research director of EY Interactive. He writes about psychology and design. Through his research he theorizes that psychology is important to design because psychology is the study of the human mind affecting in a given context, and humans will be the ones using the things you design. Psychology reflects empathy for the users. When he starts designing he thinks to himself, "what do I want on this canvas?" Then he thinks about where information will be chunked throughout is design. He says that if you invest time into your work you will build a connection with your work. Some psychological skills he uses in his design are heuristics, default effect, and scarcity effect. Heuristics build metal shortcuts when there are too many decisions to make at once. The default effect shows that many users don't adjust the settings of a device because they assume hat the designers have the best interest of the user. The scarcity effect is motivated by limited availability or exclusivity. This enhances the user's perception of scarcity. It also is a common motivator of design decisions. He ultimately encouraged us to remember to research and think of the psychology of design decisions.

Up next was Brian Crumley, a lead front end developer. He likes to think of websites as systems rather than pages. He usually starts out by asking what elements will be used in what context. To do this he needs something that starts a conversation. This is why designers use perspective style guides. This front end style guides are not made of code. It show what information you have, but it is the designer's job to find out how to use it. The info should flow in 1 direction. It is a good idea to avoid bloat or too much repeated code as it takes up too much space harming the sites performance, and improves user experience. This document optimization turns a regular document into a living document. The style guide builds a common language between all on-board staff members of the project. The guide includes basic and additional elements. The elements can later be built byte sized and accessed internally from the CSS. He finds himself using a lot of Photoshop to optimize or normalize photos. He then talked about a system for design called SEAL which stands for solicit, encourage, ask, and listen. He said that all elements on a style guide should be used at least once.

 The next person to talk was Liese Zahabi , a professor of interactive design at Maryland University. Her talk was about information science. She started out by discussing the search process when she used to work at a library and comparing it to the way Google collects data from users and targeted adds. From this she concluded that searching can be hard, especially on the Internet. She said the Internet's original purpose was to share information with many people. She stated that because all things are integrated with each other that their is really only knowledge that separates all things. Searching forms its own ecosystem on the web because the Internet is always evolving. All search engines need to organize information which can be done more easily today than ever before. Unfortunately content is formed much quicker now of days. Early websites didn't understand how to design for web because it was such new territory. Now with Google's data, it is easier to find information, which formed a consolidation and a near monopolization of search on the web. A single search sifts through an exponential amount of options that are filtered and prioritized through many categories. She ultimately wanted us to know that the Internet was a evolving ecosystem, it was created to build a better comprehension, and to embrace it as a new metaphor.

 The last speaker was John Halfpenny, a reputation specialist at BrandYourself. The most important thing to remember is what you write will be recognized on the Internet. He says your profile should be optimized for your readers so optimize it for screen. To produce your personal branding, you need to design you for you and your audience. You need to not be a phoney, be true to yourself. 5-7 brand touches are recommended to distinguish your brand. It is recommended to use social media, the big 8 he refers to, as you get recognized better and have about 7 times the personal connection with your audience. It also helps optimize your name on search engine results, which is also recommended. Another way to do this is to make use of your keywords, which should be your name, throughout your sites. It is important to fill out your bio, and build a structure of your sites through links. The overall message of his speech was to take control of your presence on the Internet.

Monday, November 21, 2016

Week 12 Outside of Class

Here is my style tile for the Square Off website. I used many photos of the product as well as their logo. I wanted to try to push the chess board look as the product is really meant for hard core chess fans.



Tuesday, November 15, 2016

Week 12B

Today was a quick class. We got our IIDcon shirts. Then we went over the last couple of details about he event. Then we learned about style tiles briefly.

Week 12A

Today we were to create at least 5 wireframes on a white board. My first one I think might be too vertical but I think it also does a good job distributing content.



The 2nd utilizes collapsible tabs that would only show the information you wanted to see and therefore clicked on.
The third one is sort of like like the second one but less vertical.
My forth one is like the first one, like how it is very vertical, but has different layout for each area of content and also a interesting nav that allows people to skip right to the area they want.
My fifth one uses small areas of content in a checkerboard like pattern.


Monday, November 14, 2016

Week 11 Outside of Class

This is my strategy for making this page so far. My page will start with a small logo in its small header. Then the feature area will take most of the first instants above the fold which will tell the viewer what the product is. Then the about section will come next. It has 2 parts, about the board and about the app. Then the game modes are split into 3 small sections each explaining a game mode. Then it will explain how it works. Then the next section will be 2 smaller areas explaining the technology and the features. Then a small section about reviews and links to read them. Then it will show off the team behind the product followed by the process that allowed them to make this product. Then at the bottom there is an area showing off the prices with an option to buy. The footer has a link to their Facebook page.

Wednesday, November 9, 2016

Week 11B

Today we showed off our ideation for the Kickstarter project. The class, as well as I, decided that Square Off was the best choice. Now we need to find content.

What it is:
Square Off - World’s Smartest Chess Board. A chess board that allows you to challenge any online opponent across the globe or play against the artificial intelligence on this automated chess board.
Made by: InfiVention Technologies

About Square Off:
Hey chess lovers!

We know that there’s nothing like playing a game of chess on a real board. But, let’s face it. It’s a busy world, people stay miles away from each other and even if someone wants to come over to play, it requires a hell lot of a planning. Phew! Too much effort. Result, you give up and end up playing chess online. How boring.


Square Off is all set to redefine the world of board games, starting with chess. Bringing to you the world’s smartest, most connected and the most evolved chess board. It enables you to play your favorite game against a fellow chess enthusiast from anywhere in the world. The automated board is designed to reflect the move of your opponent with precision. Not just that, you can challenge the artificial intelligence of the board too.

Yes, Square Off is here to bring back those charming old days when people played chess on classic tangible boards. Felt chess from their heart, indulged in the luxury of playing with wooden boards and handcrafted chess pieces. Where on one hand, it has revived the classic charisma of chess, on the other hand, Square Off has also made it smarter, automated and super fun.

Want to play a game of chess with someone who is as passionate? Possible. What if that person is sitting far away? Possible. What if he doesn’t have the same board? Still possible. Now, what’s not possible is to have an excuse for not playing your favorite game.

So let’s get connected. Let’s Square Off!

About the App:
Compatible with both Android and iOS (currently in beta) operating systems, Square Off is designed as a user-friendly app. It lets you interact with the board effortlessly; it just takes a click to begin the game.

But why an app? The idea is to keep the board button-free so that the users can enjoy the classic chess board experience. Be it selecting sides (black or white), difficulty levels, opening moves of computer, challenging friends, analyzing games, using the timer or chatting with the opponent (this feature is being worked upon), everything is controlled through the app.

Phone is connected to the board all the time via Bluetooth, allowing you to save an incomplete game. Also, it uses your phone’s Wi-Fi to connect to the internet and your phone’s processor to process the data and think of the next possible moves.

Currently, it works on Stockfish 7 which is one of the best open source chess engine and second engine is Cuckoo Chess, which is suitable for beginners. We plan to offer more chess engines in the future.

A Brief History of Chess:
The origin of the game chess is a fascinating and somewhat unknown tale, stretching continents and many hundreds of years. In the last 25 or so years, however, it has gone from a game played on a beautiful board with finely crafted pieces, to something played on a computer or smartphone. Perhaps this is a good thing, since finding competition is as easy as signing into the correct game.

On the other hand, this type of play looses a lot of charm, and you can’t exactly pass the app on your beat up smartphone to your kids one day. Attempting to fill in the gap is the amazing automated board called “Square Off.” This is the future of chess.

Game Modes:
Square Off mode: Challenge anybody, from anywhere in the world. You can either play board vs board or board vs app. The chess pieces shall move on their own, reflecting every move of your opponent.

Training mode: Play against the artificial intelligence of the board that can challenge you with 20 different difficulty levels.

 Live streaming mode: Tune into any match, worldwide. It also lets you record those matches and replay them, whenever you want.

What Our Fans are Saying:
"If you love chess, but aren’t thrilled about playing it on an app, the InfiVention team has just the board for you."
    - Audrino, https://blog.arduino.cc/2016/10/17/square-off-is-a-chess-board-with-a-high-tech-twist/

"It's just like playing against a real opponent!"
     - CB News, https://en.chessbase.com/post/world-s-smartest-chess-board-is-here

How it Works:
It uses a compact 2 axis robotic arm with a magnetic head beneath the box to move the magnetic chess pieces. The AtMega 2560 chip with Bluetooth BLE ensures smooth communication with a smartphone, taking care of decrypting and execution. The most important thing is that it is programmed in a way so that the chess pieces don’t collide during automatic movements.

Two chess boards are connected with each other with the help of the Square Off app on your smart phone. The app will connect you with an opponent sitting anywhere in the world. Suppose you get the white pieces and make the move 1.e4 on the board. That same move will be automatically executed on your opponent's board! It's just like playing against a real opponent! Besides human opponents, you can also play against the in-built engine which will automatically make its moves.

Technical Specifications:


Additional Features:  

  • Play against 20 different difficulty levels
  • Select opening moves with ease 
  • Load and save an incomplete game 
  • Membrane sensing technology to detect the location of pieces 
  • Receive audio feedback during check, promotion, checkmate and for invalid moves (invalid moves, strictly not allowed) 
  • Get all the instructions through the app, on your phone screen

The InfiVention Technologies Team:


How Square Off came to be:

In the year 2013, the Chairperson of National Association of Blind (NAB) got in touch with us to understand the feasibility of an idea. He wanted us to design a chessboard for the visually impaired. It’s not possible for them to play chess on computers and smartphones. We, being board game lovers ourselves, simply dived in to explore the possibilities. We researched tirelessly to finally arrive at a design. But, we didn’t have any funds to bring it alive. That’s when an idea struck us.

We started participating in various technical paper presentations and national level tech competitions to earn the prize money, just to create the prototype. Gradually we gathered sufficient money to design our first prototype in 2014. And guess what? It worked.  

The Chairman of NAB who was visually impaired himself, tested the prototype and loved playing on it. We showcased this prototype in many national exhibitions and got a great response. But, on 3rd October, 2014, for the first time we got an opportunity to present our prototype in front of an international audience in Maker Faire, Rome. This was the real turning point.

The tremendous response and exhaustive feedback helped us realise that the board has the potential to connect the entire world. So, the moment we returned, we were driven to work harder. We created 4 more prototypes and visited several events to get as much feedback as possible. We are board game lovers, but not exactly pro chess players. That’s why it was necessary to find out about those features that would really excite a chess player? From the very beginning, we were dedicated to bring alive the features requested by the users. 

More opportunities flowed in. We were invited to showcase the prototype at all the IITs in India, then MIT Boston FAB 11, Startup Istanbul and the Sharjah Chess Club. After 3 years of sustained efforts, finally our Beta product was ready in May 2016. To test the product and gauge the response, we produced a small batch of Collector’s Edition Square Off boards and sold 20 specially created, highly premium boards within no time.  

The next step was to work out the mechanics of a large scale production. The aim was clear: get the best price without compromising on the quality of the board. 

However, the challenge was to find a manufacturer that would offer an incredible combination of technology and luxury. In other words, advanced software and hardware perfectly encased in a premium wooden surface. End of July 2016, we visited Shenzhen, China to explore the manufacturing possibilities. Shenzhen, being the electronics hub of the world, offered the technical expertise we were looking for without much trouble. But, finding a dealer for wood wasn’t that easy. 

After a lot of research, we fortunately stumbled upon a dealer who could supply the desired quality of wood. And now we are all set to produce on a bigger scale to reach a larger number of people.



Cost:
Kingdom set: Retail price will be about 300.
Grand Kingdom set: Retail price will be about 360.
Twin Kingdom set: Retail price will be about 600.
Club pack Kingdom set: Retail price will be about 3000.


Tuesday, November 8, 2016

Week 11A

We were to find 3 Kickstarter campaigns with poorly designed websites. The 3 I've found were, the best shirt ever, Iprobe, and suare off.

The Best Shirt Ever is a waterproof, stainproof button-down T-shirt. It is made by a company called Clickbait Clothing. Their website shows off the shirt with many videos and images but not a lot off text. They do have links to their social media and Kickstarter campaign but they don't explain the product fully and the page seems like it lacks necessary content. The campaign explains more functionality of the shirt such as the material it's made out off, and the fact that's it is machine washable. The site could also use an explanation of how it works and the science behind it, which again is on the campaign. They could also have more info on the company seeing as the site is actually named after the company and not the product.

The site can be found here: http://www.clickbaitclothing.com/
The campaign can be found here: https://www.kickstarter.com/projects/1932357265/the-best-shirt-ever?ref=popular

Iprobe and Iprobe4 are smart meat thermometers by iPROBE LLC. A very important part of cooking meat is getting to just the right temperature, so that is why this product is important. Different meats need to cooked at different temperatures, and coking them just right removes bacteria but retains flavor and nutrients. Iprobe is a clever combination of an electronic thermometer and a mobile app. The app part allows you to choose what type of meat is being cooked and it will let you know what temperature the meat must reach to be done, then you just insert the thermometer into the meat and the meat into the oven. The app then alerts the user when the meat is done. There is certainly enough content here to promote this quality product, but it does not have a proper website. The link on Kickstarter that says iprobe.org just takes you back to the Kickstarter page. This is unfortunate because I think this item could use a proper website. Perhaps I shall design one.

The campaign can be found here: https://www.kickstarter.com/projects/466385313/iprobe-and-iprobe4-your-meat-will-never-be-a-shame?ref=popular

Square Off is the world's smartest chess board. It can allow you to play with other people using the Internet or by using the built in AI. It has many modes; square off, training, and live streaming. Square off mode allows you to challenge anybody, from anywhere in the world. You can either play board vs board or board vs app. The chess pieces shall move on their own, reflecting every move of your opponent. Training mode mode allows you to play against the artificial intelligence of the board that can challenge you with 20 different difficulty levels. Live streaming mode allows you to tune into any match, worldwide. It also lets you record those matches and replay them, whenever you want. It works by using a series of compact, magnetic hands built inside the board to move the magnetic chess pieces. It is programmed to not have any collisions with other chess pieces during movement. This sounds really cool, and I not even the biggest chess fan. The content is there and the quality of the product is there but the website is lacking. The link that reads squareoffnow.com takes you to there facebook page. That's isn't an attack on facebook's quality but it would be so much nicer if this product had an official website.

The campaign is here: https://www.kickstarter.com/projects/infivention/square-off-worlds-smartest-chess-board-relaunched?ref=popular
The site is here: https://www.facebook.com/getsquareoff/

Monday, November 7, 2016

Week 10 Outside of Class

I actually got a response from CPLUG surprisingly. Unfortunately it seems like they might not be able to make it seeing as they already have other plans. They also sent me more mail.

I also did a tutorial for html and css. Here is how it turned out:
html:


CSS:





 html;

css:







Using some knowledge learned from the tutorial, I changed my vacation site.



Week 10B

Today I actually got the email to work for CPLUG. I sent to them and I now am waiting for a response but I don't know if they will.

Tuesday, November 1, 2016

Week 10A

Today we were to find contact information for non-profit groups that would be interested in IID con. Here is a list of places and people I found that might be interested:















The ones with the * on them were the ones that I was told to focus on. Techlancaster led to a list of information technology meet ups and groups, and the one my group wanted me to contact was CPLUG, Central Pennsylvania Linux Users Group. I found them difficult to get a hold of because they want to be contacted through an Internet Relay Chat which haven't been popular since the 1980's instead of today's traditional emails. They have an option for emails but it didn't work when I tried to send them an email and then Gmail had to send me an error message saying the mail failed. I honestly didn't think that they would really be interested in a graphic design event because they seem to be more of a Computer Science crowd. Also they like to use older stiles of communication on the web which makes me wounder if they are up to anything strange. I was actually afraid of being hacked by them just for attempting to contact them. This was very much out of my comfort zone.

We had to create a simple html document, no styles at all, describing a dream vacation of ours. This was very simple, probably because it's just a test to see were we are with coding skills.

We were to also read Chapter 1 of Behind the Fold. It described website development as a multi step, multi discipline process. Effective planing will lead to a high return on investment and also a clear scope of work that would be needed. SWOT stands for strengths, weaknesses, opportunities, and threats. These are internal and external problems and solutions. The chapter also described the process parts such as sitemaps, wireframes, usabillity diagrams, prototypes, mood boards, and style tiles.