Sergei’s avatar image

Sergei Kalugin

Speaker pictogram

Hi there, nice to meet you! I’m a full-stack web developer with a special interest in design, UX/UI, ergonomics, and human-machine interaction. In my work, I emphasize simplicity, usability and expressiveness.

Recent work
  • PP project icon
    • XML
    • TEI
    • XSLT
    • Gulp
    • jQuery
    • SVG

    The Pulter Project

    This digital edition of poems, written by an early modern poet Hester Pulter, posed interesting challenges in the areas of design, content encoding and processing, as well as front-end scripting.

    120 poems and accompanying critical commentary were thoughtfully united by an interface that creates a comfortable reading experience and stimulates exploration. Open the mock-ups to see the thought process.

    External link icon
    Splash page gif animation

    Splash page animation

    Poem index fragment

    Poem index

    Single poem view

    Single poem

    Editorial note fragment

    Editorial note

    Informational page fragment

    Page styling

    Search results screen shot

    Search functionality

    Rich headnote fragment

    Rich headnotes

    Manuscript viewer

    Manuscript viewer

  • FF project icon
    • Angular
    • Typescript

    Flipped French

    This Angular app is intended to be an alternative for a course book in a “flipped” classroom environment. It features a collection of interactive exercises, textual and video grammar content.

    Some of the preparatory design work can be seen here.

    External link icon
    Student dashboard UI fragment

    Student dashboard UI

    Course path UI fragment

    Course path UI

    Multiple choice exercise fragment

    Multiple choice

    Chat simulator UI fragment

    Chat simulator

    Match exercise

    Match exercise

    Grammar content screen shot

    Grammar content

    Drag-and-drop exercise

    Drag-and-drop

    Type-in exercise

    Type-in exercise

    Section plan page

    Section plan

  • CM project icon
    • AngularJS
    • Omeka
    • PHP
    • Mapbox

    Chicago Mural Movement

    This is a class-based creation showcasing a collection of Chicago murals from the 60s and 70s. Metadata handling, mapping, and graphic manipulation were among the key aspects of the project.

    The back-end is powered by Omeka CMS and the Angular.js app is consuming the data exposed by Omeka’s REST API.

    External link icon
    Dynamic splash page

    Dynamic splash page

    Full grid view

    Full grid view

    Compact list view

    Compact list view

    Map view

    Map view

    Mural detail page

    Mural details

    Mural location tab

    Mural location

    Image magnifier feature

    Image magnifier

  • NU project icon
    • Angular
    • Typescript
    • HTML5

    Notunterkunft

    A group of students travelled to Berlin to learn about the lives of people living in a “Notunterkunft”—a shelter for immigrants. This Angular app presents their work in a collection of unique stories.

    See this InVision prototype to get an idea about the design process for this site.

    External link icon
    Splash page

    Splash page

    Bilingual UI

    Bilingual UI

    Story list

    Story list

    Story cover page

    Story cover

    Story navigation fragment

    Story navigation

    Podcast content type

    Podcast content type

  • More Work
  • Letter V icon
    Visualizing Les Mis

    Visualizing a novel is an exciting challenge. This WordPress site showcases the result of that work through a variety of interactive graphs and maps.

    • Wordpress
    • PHP
    • SVG
    • R
    • Gephi
    • Community detection
  • Letter O icon
    Open Door Archive

    Omeka-based digital repository and exhibition space is dedicated to the print culture and multimedia archives of multiethnic poetry.

    • Omeka
    • PHP
    • MySQL
    • PDF
    • Metadata
    • Dublin Core
  • Letter W icon
    WildWords

    This class-based project is an attempt to create an encyclopedia of university-specific language. The chosen engine—MediaWiki—allows the site to evolve over time.

    • CakePHP
    • MediaWiki
    • SVG
  • Letter S icon
    Shakespeare’s Circuits

    Another custom class-based WordPress site shows the work of students who—equipped with modern digital tools— explore Shakespeare’s powerful global impact.

    • Wordpress
    • PHP
    • Twig
    • Carto
Even More Work
Miscellaneous

When I’m not in front of a computer, I play! That includes both indoor activities (piano, chess, puzzles, etc.) and outdoor adventures. Moving through space is my true passion.

P.S.
I log my workouts on Strava logo . Feel free to follow me, I’m curious to see what you’re up to.

P.P.S
Fancy a game of chess? Challenge me at Chess.com logo!