From d00ebe172137cf228e2cfd3b98bae2bb9ff144e2 Mon Sep 17 00:00:00 2001 From: Ben Serrette <607066+benserrette@users.noreply.github.com> Date: Wed, 4 Jun 2025 00:06:39 -0400 Subject: [PATCH] Add project pages --- index.html | 19 ++++++++++++ projects/cadre.html | 39 +++++++++++++++++++++++++ projects/cam.html | 34 ++++++++++++++++++++++ projects/captain-numbskull.html | 29 +++++++++++++++++++ projects/comics.html | 31 ++++++++++++++++++++ projects/hoaxy.html | 47 ++++++++++++++++++++++++++++++ projects/illustrated-guide.html | 26 +++++++++++++++++ projects/imls-video.html | 29 +++++++++++++++++++ projects/infinite-canvas.html | 34 ++++++++++++++++++++++ projects/osome.html | 43 +++++++++++++++++++++++++++ projects/shake-it-tarot.html | 51 +++++++++++++++++++++++++++++++++ projects/strips-4-singles.html | 24 ++++++++++++++++ projects/the-stache.html | 32 +++++++++++++++++++++ projects/vaporbot.html | 30 +++++++++++++++++++ 14 files changed, 468 insertions(+) create mode 100644 projects/cadre.html create mode 100644 projects/cam.html create mode 100644 projects/captain-numbskull.html create mode 100644 projects/comics.html create mode 100644 projects/hoaxy.html create mode 100644 projects/illustrated-guide.html create mode 100644 projects/imls-video.html create mode 100644 projects/infinite-canvas.html create mode 100644 projects/osome.html create mode 100644 projects/shake-it-tarot.html create mode 100644 projects/strips-4-singles.html create mode 100644 projects/the-stache.html create mode 100644 projects/vaporbot.html diff --git a/index.html b/index.html index 5010540..c0a56f5 100644 --- a/index.html +++ b/index.html @@ -56,6 +56,25 @@

Links

+
+
+

Projects

+ +

About Me

diff --git a/projects/cadre.html b/projects/cadre.html new file mode 100644 index 0000000..973a2e7 --- /dev/null +++ b/projects/cadre.html @@ -0,0 +1,39 @@ + + + + + + CADRE - Ben Serrette + + + +

CADRE

+

Collaborative Archive & Data Research Environment

+
+
+
+

+ The Collaborative Archive & Data Research Environment (CADRE) addresses the critical issue of providing sustainable, affordable, and standardized data and text mining services for licensed big data sets. +

+ +
+

+ CADRE features a number of complimentary pieces. The web-based interface is hosted on AWS and uses several services to connect the frontend with the middleware and databases. +

+

+ As lead software engineer I directed the IUNI IT Team in the design and implementation of the CADRE Gateway. The frontend was built with Vue.js and Bootstrap, while asynchronous database queries ran via AWS SQS. +

+

+ The marketing site uses the flat-file CMS Grav and AWS SNS for contact forms. After becoming Director of IT I successfully brokered a deal to sunset the project, saving significant resources. +

+
+
+

Back to Home

+ + + + diff --git a/projects/cam.html b/projects/cam.html new file mode 100644 index 0000000..ed41d03 --- /dev/null +++ b/projects/cam.html @@ -0,0 +1,34 @@ + + + + + + CAM - Ben Serrette + + + +

Conference Agenda Manager

+

CAM

+
+
+
+

+ The Conference Agenda Manager (CAM) allows conference administrators to provide attendees with a searchable database of events. Attendees can build and share customized agendas without creating an account. +

+ +
+

+ CAM was built at IUNI for NetSci 2017 and used again for NetSci 2018. +

+

+ The front-end was created with Quasar and intended for compilation into a native mobile app. Backend services were written in PHP with a MySQL database. +

+
+
+

Back to Home

+ + + + diff --git a/projects/captain-numbskull.html b/projects/captain-numbskull.html new file mode 100644 index 0000000..b892bb2 --- /dev/null +++ b/projects/captain-numbskull.html @@ -0,0 +1,29 @@ + + + + + + Captain Numbskull - Ben Serrette + + + +

Captain Numbskull in Space

+
+
+
+

Space. It’s cold, it’s dark, and it goes on forever. There is an infinite number of points in the space between here and there. At each point there awaits untold dangers and unforeseeable peril. Few men dare to brave this great emptiness alone. Our good captain is one of them and no amount of space will keep him from the adventure that lies ahead.

+
excerpt from CaptainNumbskull.com
+
+

Captain Numbskull in Space is a comic book about a bumbling space pirate and his exploits in space.

+

Numbskull was originally created as a random filler comic for The Vermilion during the summer of 2005. The concept was so appealing that I continued sketching Numbskull until finally creating a comic book based on the character.

+

The comic was finally completed and, thanks to a successful Kickstarter, printed in 2014.

+

Want a copy? Hit me up at email me and we can work something out.

+
+
+

Back to Home

+ + + + diff --git a/projects/comics.html b/projects/comics.html new file mode 100644 index 0000000..5d9e2f5 --- /dev/null +++ b/projects/comics.html @@ -0,0 +1,31 @@ + + + + + + Comics - Ben Serrette + + + +

Comics

+

Storytelling with Sequential Art

+
+
+

I have enjoyed comics since I was a youth, both reading and creating them. Below is a collection of comics I've created over the years, some dating back to 2004.

+

Toilet Humor and Dick Jokes

+

The site is hosted on Neocities because it reminds me of the glory days of GeoCities.

+

Strips 4 Singles

+

I devised Strips 4 Singles as a way to encourage drawing by taking $1 commissions. A gallery of some of the strips can be found here.

+

24 Hour Comic Day 2014

+

24 Hour Comic Day is a yearly event where cartoonists create comics from start to finish in 24 consecutive hours. I participated in 2014 and almost succeeded, finishing the next day.

+

Poonheads

+

My first foray into web comics followed the bizarre misadventures of three friends. The archive can be found at poonheads.com.

+
+
+

Back to Home

+ + + + diff --git a/projects/hoaxy.html b/projects/hoaxy.html new file mode 100644 index 0000000..67d4eee --- /dev/null +++ b/projects/hoaxy.html @@ -0,0 +1,47 @@ + + + + + + Hoaxy - Ben Serrette + + + +

Hoaxy

+

Misinformation Research Tool

+
+
+
+

+ Hoaxy is a tool that visualizes the spread of articles online. Articles can be found on Twitter, or in a corpus of claims and related fact checking. +

+ +
+

+ I began working on Hoaxy as a consultant in fall of 2016, but we were unable to get it launchable in time for the election. Months later, we got a grant to incorporate Botometer into Hoaxy. +

+

+ As part of the grant, I was assigned as the lead front-end developer. We built the original prototype using JQuery, but because there would be a great deal more functionality added on for the grant, I elected to port the front-end to Vue.js. We also used NV.D3 for the timeline and Sigma.js for the network graph visualization. +

+

+ The members of the Hoaxy team have changed multiple times over the course of its development. During my time as lead developer I trained and mentored many incoming developers. After becoming IT Director, development was taken over by my team of software engineers. +

+

+ After Twitter discontinued its free API plans, OSoMe was unable to maintain Hoaxy's search capabilities directly. It now offers a few free searches, after which a user with a paid plan must input their bearer token and use their own search quota. +

+

+ An older, open source version of Hoaxy's frontend code can be found on GitHub. +

+
+
+

Back to Home

+ + + + diff --git a/projects/illustrated-guide.html b/projects/illustrated-guide.html new file mode 100644 index 0000000..adac862 --- /dev/null +++ b/projects/illustrated-guide.html @@ -0,0 +1,26 @@ + + + + + + An Illustrated Guide to Programming - Ben Serrette + + + +

An Illustrated Guide to Programming

+

for Absolute Beginners and the Computer Illiterate

+
+
+

This book was an assignment for an instructional design course. The requirement was to create a fully illustrated booklet of at least 16 pages. As both a programmer and an illustrator, I merged the two to create a primer explaining the basics of computer programming using lengthy illustrations instead of paragraphs.

+

Programming cannot really be explained in 16 pages, so the project soon ballooned to around 100 pages.

+

I consider this volume 1 in a series. The deadline approached before I could tackle advanced topics. I hope to eventually complete this book or create a volume 2, and find a cost-effective way to publish it.

+

You can download the contents here (PDF).

+
+
+

Back to Home

+ + + + diff --git a/projects/imls-video.html b/projects/imls-video.html new file mode 100644 index 0000000..835346c --- /dev/null +++ b/projects/imls-video.html @@ -0,0 +1,29 @@ + + + + + + IMLS Video - Ben Serrette + + + +

IMLS Video

+

Animated introduction video for CADRE

+
+
+

The CADRE project was funded by a grant from the IMLS. To support the proposal, we needed an eye-catching introduction video explaining the problem and our proposed solution.

+

With limited resources, the IUNI IT Team brainstormed a "whiteboard" style animation because it could be produced quickly with off-the-shelf software. I created the visuals, tracing drawings into Illustrator and importing them into the animation software.

+

The script was a collaboration between the principal investigators and our data manager, who also provided the narration thanks to his British accent.

+

The entire process was completed in under a week and is widely believed to have been a major factor in the success of our grant proposal.

+
+ +
+
+
+

Back to Home

+ + + + diff --git a/projects/infinite-canvas.html b/projects/infinite-canvas.html new file mode 100644 index 0000000..b0516fd --- /dev/null +++ b/projects/infinite-canvas.html @@ -0,0 +1,34 @@ + + + + + + Infinite Canvas 2.0 - Ben Serrette + + + +

Infinite Canvas 2.0

+

2010 Masters Capstone Project

+
+
+

Summary

+

This project explores bringing Scott McCloud's idea of the Infinite Canvas into the social arena of Web 2.0.

+

The prototype was built using JQuery.

+

The final paper can be found here (.pdf, 3.49MB).

+

The final presentation can be viewed here (.pdf, 11.6MB). A video of the final presentation can be found at vimeo.com/13216700.

+

Introduction

+

Comics as most people think about them have been around since the late 1700s. They range from short political cartoons to super hero comic books to graphic novels.

+

Comics is, however, a much more diverse medium. Will Eisner defined comics as "sequential art". Scott McCloud expands this with his own definition of "juxtaposed pictorial and other images in deliberate sequence." Under these definitions, the word "comics" can be applied to early cave paintings and Egyptian hieroglyphics.

+

The most recent format for comics is the web comic. Web comics are, as the name implies, comics posted on the web. While web comics can be traced back to Usenet, they became popular in the late 1990s with the start of such comics as Penny Arcade and PVP.

+

Until recently, comics were confined to the physical dimensions of the medium that the comic is created in. In 1999, McCloud introduced the concept commonly known as the Infinite Canvas. Screens could be used as windows to view a comic, allowing panels to be placed in any direction and size, virtually without limit.

+

Unfortunately, with the exception of a few experimental comics, the infinite canvas never took off. McCloud attributed this to both technical and mental limitations. At the time screen sizes were limited and broadband access was rare.

+

Today we live in the world of Web 2.0. There is no reason the Infinite Canvas cannot take advantage of dynamic sites and social media to become a rich, interactive experience.

+
+
+

Back to Home

+ + + + diff --git a/projects/osome.html b/projects/osome.html new file mode 100644 index 0000000..3422cce --- /dev/null +++ b/projects/osome.html @@ -0,0 +1,43 @@ + + + + + + OSoMe - Ben Serrette + + + +

OSoMe

+

Observatory on Social Media

+
+
+
+

What is the Observatory on Social Media?

+

+ The Observatory on Social Media (OSoMe, pronounced awe•some) is a joint project of the Center for Complex Networks and Systems Research at the Luddy School, the Media School, and the Network Science Institute at Indiana University. OSoMe unites data scientists and journalists in studying the role of media and technology in society, and building tools to analyze and counter disinformation and manipulation on social media. +

+ +
+

+ OSoMe was originally created as a sophisticated data collection and storage system to archive the Twitter stream. Over time, OSoMe expanded into a set of tools used to combat misinformation on Twitter. +

+

Development

+

+ My initial contribution to OSoMe was the Diffusion Network Graph. The interface was created using Angular and Zurb Foundation while the middleware used Python and NetworkX. +

+

+ As OSoMe's mission grew, so did my role. I led the development of the Hoaxy frontend, mentored junior developers, and oversaw the creation of BotSlayer. I continue to guide the technical strategy for OSoMe's tools. +

+
+
+

Back to Home

+ + + + diff --git a/projects/shake-it-tarot.html b/projects/shake-it-tarot.html new file mode 100644 index 0000000..280b758 --- /dev/null +++ b/projects/shake-it-tarot.html @@ -0,0 +1,51 @@ + + + + + + Shake It Tarot - Ben Serrette + + + +

Shake It Tarot

+

Tarot Card Android App

+
+
+

+ The idea is that by adding the human factor back into the process, this digital deck will provide a more accurate and personal reading. +

+

+ I don't generally believe in that kind of thing, but if Tarot cards were real, the physical act of shuffling would matter. Digital Tarot apps typically remove this interaction, so this app uses the phone's accelerometer to mimic shuffling. +

+
+
Tarot screenshot
+
Tarot screenshot
+
Tarot screenshot
+
+

Credits

+

Tarot Info

+ +

Images

+ +

Technology

+ +
+
+

Back to Home

+ + + + diff --git a/projects/strips-4-singles.html b/projects/strips-4-singles.html new file mode 100644 index 0000000..6683a40 --- /dev/null +++ b/projects/strips-4-singles.html @@ -0,0 +1,24 @@ + + + + + + Strips 4 Singles - Ben Serrette + + + +

Strips 4 Singles

+
+
+

I like drawing, but never really have a reason or the drive, so I devised Strips 4 Singles as a way to solve both problems. People submit things for me to draw, and since they pay for them, I’m obligated to create.

+

Obviously, with at most $9 per project, it’s not very sustainable financially, but the intention was not to make money off of it.

+

The website was originally built with Ruby on Rails, but is now defunct. Want your own Strip 4 Singles? Hit me up and we can work something out.

+
+
+

Back to Comics

+ + + + diff --git a/projects/the-stache.html b/projects/the-stache.html new file mode 100644 index 0000000..3123139 --- /dev/null +++ b/projects/the-stache.html @@ -0,0 +1,32 @@ + + + + + + The Stache - Ben Serrette + + + +

The Stache

+

Video Game About a Man Missing His Mustache

+
+
+

About

+

The Stache was created in 2009 using RPG Maker VX for an Interactive Storytelling course at Indiana University.

+

Its story revolves around a man named Barry who wakes up with his award winning mustache missing from his face. Barry must go around town, interact with citizens, and discover what happened to the 'stache. Along the way, he collects famous mustaches which grant him their powers.

+ +

Development

+

The adventure-game style gameplay was inspired by titles like Leisure Suit Larry. RPG Maker was chosen to allow the team to focus on story rather than learning a new engine.

+

The code and binary can be found on the Github Repository.

+
+
+

Back to Home

+ + + + diff --git a/projects/vaporbot.html b/projects/vaporbot.html new file mode 100644 index 0000000..2b99721 --- /dev/null +++ b/projects/vaporbot.html @@ -0,0 +1,30 @@ + + + + + + VaporBot - Ben Serrette + + + +

VaporBot

+

Music Generating YouTube Bot

+
+
+
+

Born in cyberspace, with roots in punk rock, a foundation in computer science, and more than a pinch of sci-fi futurism, VaporBot produces a unique brand of artificially improvisational synthetic jazz-wave, called robowave, that's great for chilling, studying, or sleeping.

+
VaporBot Spotify page
+
+

Inspired by the niche electronic musical genre of Vaporwave, I created a Python script to generate songs and upload them to YouTube.

+

Later versions added additional synths and generated audio via scripted MIDI. The video components pulled random images and applied glitch effects. "Yosemite.txt" was the first to use actual video, rather than a still image.

+

The YouTube channel was automated and has over 400 songs. The Spotify channel hosts several albums.

+

At some point, the bot aspect took a backseat to the music aspect. Much of the code now lives in a Jupyter notebook that I use to just make music.

+
+
+

Back to Home

+ + + +