Skip to content

Instantly share code, notes, and snippets.

View rfprod's full-sized avatar
☯️

Vadim rfprod

☯️
View GitHub Profile
@rfprod
rfprod / Random shape generator.markdown
Last active May 30, 2021 12:53
Random shape generator

Random shape generator

Hit highlighted region to generate an object of square or circular shape randomly. The object is randomly coloured, randomly positioned within svg object bounds, 20px<=(square side)<=150px, 30px<=(circle diameter)<=200px. Hit randomly generated object to dismiss it.

A Pen by V on CodePen.

License.

@rfprod
rfprod / Learn single-digit numbers addition.markdown
Last active April 22, 2017 15:48
Learn single-digit numbers addition

Learn single-digit numbers addition

Angular app for learning single-digit numbers addition. Numbers for the exercise are randomly generated. First is in range [6,9], numbers sum is in range [11,14]. User can see a scale, which visualizes the task. User can input digits. If first number is correct, its input field is blocked, second input is shown to user. If second number is correct, its input field is blocked, result input is unlocked. If result is correct, user is congratulated and offered to try again. Upon wrong number input its color turns red, and correct number is highlighted in equation on the top of the page.

A Pen by V on CodePen.

License.

@rfprod
rfprod / Messaging App Template [Twitter Bootstrap].markdown
Last active July 16, 2017 20:32
Messaging App Template [Twitter Bootstrap]

Messaging App Template

AngularJS app uses libraries: jQuery, Bootstrap, AngularJS. User stories: User can select a Conversation, and see messages inside the Conversation in a separate section to the right of Conversations list. User can post a message to the selected Conversation (this information is stored locally and is discarded on the page reload). User can use markdown for message text formatting.

A Pen by V on CodePen.

License.

@rfprod
rfprod / The Eysenck Personality Questionnaire .markdown
Last active April 22, 2017 15:48
The Eysenck Personality Questionnaire
@rfprod
rfprod / Meteorite Strike Data Across the Globe.markdown
Last active April 22, 2017 15:49
Meteorite Strke Data Across the Globe

Meteorite Strike Data Across the Globe

User can see where all Meteorites landed on a world map. User can tell the relative size of the meteorite, just by looking at the way it's represented on the map. User can mouseover the meteorite's data point for additional data. User can mouseover the country region for country name.

A Pen by V on CodePen.

License.

@rfprod
rfprod / Data Visualization with Force Directed Chart.markdown
Last active November 25, 2017 18:59
Data Visualization with Force Directed Chart

Data Visualization with Force Directed Chart

User can see a Force-directed Graph that shows which campers are posting links on Camper News to which domains. User can see each camper's icon on their node. User can see the relationship between the campers and the domains they're posting. User can tell approximately many times campers have linked to a specific domain from it's node size. User can tell approximately how many times a specific camper has posted a link from their node's size.

A Pen by V on CodePen.

@rfprod
rfprod / Data Visualization with Multi-Bar Chart.markdown
Last active April 22, 2017 15:49
Data Visualization with Multi-Bar Chart

Data Visualization with Multi-Bar Chart

User can view a heat map with data represented both on the Y and X axis. Each cell is colored based its relationship to other data. User can mouseover a cell in the heat map to get more exact information.

A Pen by V on CodePen.

License.

@rfprod
rfprod / Data Visualization with Scatterplot Chart.markdown
Last active April 22, 2017 15:49
Data Visualization with Scatterplot Chart

Data Visualization with Scatterplot Chart

Doping in Professional Bicycle Racing. User can see performance time visualized in a scatterplot graph. User can mouse over a plot to see a tooltip with additional details.

A Pen by V on CodePen.

License.

@rfprod
rfprod / Data Visualization with Bar Chart.markdown
Last active April 22, 2017 15:49
Data Visualization with Bar Chart

Data Visualization with Bar Chart

US Gross Domestic Product data visualization using D3.js.

A Pen by V on CodePen.

License.

@rfprod
rfprod / Roguelike Dungeon Crawler.markdown
Last active April 22, 2017 15:50
Roguelike Dungeon Crawler

Roguelike Dungeon Crawler

Player has health, a level, and a weapon. Player can pick up a better weapon. Player can pick up health items. All the items and enemies on the map are arranged at random. Player can move throughout a map, discovering items. Player can move anywhere within the map's boundaries, but can't move through an enemy until it's beaten. Much of the map is hidden. When player take a step, all spaces that are within a certain number of spaces from me are revealed. Player can toggle Fog of War. When player beats an enemy, the enemy goes away and the player get XP, which eventually increases player's level. When player fight an enemy, both take turns damaging each other until one loses. Player does damage based on player's level and weapon. The enemy does damage based on its level and strength. Damage is somewhat random within a range.