Hi!

I'm RORIRI

A neuroscience scientist with psychology, education background and professional programming, design skills.

Highlights

  • A comprehensive background of neuroscience, psychology, programming and designing allows me to understand very well and fulfill different kinds of requirements.
  • I am certified as an educator, and have a comprehensive background in data science, neuroscience and psychology, which can provide students with a broad vision.
  • I am good at making things easier to understand, like designing intuitive interface and writing documentation. I also have experience in teaching in workshops and public speeches.

Projects

Research Related

ezTrigger System

A micro-framework for multi-subject psychology experiments.

Node.jsElectronAHK

ezTrigger System is a framework which can help researchers connect their experiment program through TCP socket, it provides a consistent API among multiple pieces of equipments and platforms. With the help of this system, researchers could avoid learning multiple hardware communication protocols and reduce the cost of switching hardware platform.

I designed the application and protocol architecture of the system, completed a set of server programs(with Node.js), client programs(with Electron), and adapted to LABNIRS (with AHK), PsychoPy(with Python) platform.

This platform has been applied to 6 pieces of research.

brainSpy

A fast way to convert a lot of MNI coordinates to AAL/BA label.

Python

A project inspired by label4MRI, labeling brain areas is a very painful work, brainSpy provided a simple and fast way to convert MNI coordinates to AAL/BA label.

I designed the basic architecture and a non-standard atlas format to reduce the size of the Python binary bundle.

Web Development

Nice Stick Technology Limited

A content production team focused on gamification of education.

ReactTypeScript

A new company was formed by restructuring a previous content production company. The focus of this new company is on gamification of education. As the architect and technical mentor of this new company, my responsibility was to reorganize the engineering architecture of five content products that had been left behind. I also had to adapt these products to a more generic content product development framework, while exploring the possibility of adapting them to desktop and mobile platforms.

To optimize the application's performance on low-performance platforms, I redesigned the asynchronous task scheduling mechanism, which significantly improved the overall performance and user experience. I also restructured the resource management architecture to effectively address the engineering complexities of internationalization and multi-platform multi-version distribution.

Additionally, I independently took charge of product design, interface design, and development of the content management and distribution platform. I successfully solved the problem of deploying multi-content, multi-platform products through appropriate architectural design. Furthermore, the complexity of product launching task was significantly simplified by adding automation to the process.

Playground

A paid content platform

ReactTypeScriptPIXI.jsThree.jsCanvas / WebGLGo

The Paperclip team has created a paid content platform that hosts high-quality video and article content. Their first series, "The Birth of an Artificial Intelligence," was a unique blend of game elements and video content, known as interactive videos. This innovative approach garnered significant social attention and sparked engaging discussions.

As the core developer of the website, I played a crucial role in its development. I participated in creating interactive games with PIXI and Three.js and conducted extensive exploratory work to provide best practices for complex animation design and engineering organization during the development of interaction nodes. Additionally, I designed and developed the core API for the project infrastructure and created the data generation and fetching model for machine learning process demonstration. Finally, As part of my efforts to optimize mobile application memory footprint, I designed and developed a publicly available online texture conversion tool. This tool has gained popularity among WebGL developers due to its high ease of use and effectiveness in optimizing memory usage.

I also developed the gateway for the internal testing platform, and contributed to the operation and maintenance of the website. I was also involved in community operations for the Telegram platform.

Team SC's Website

A well-designed academic homepage that follows the Material Design design guideline.

ReactWebpackExpressIISPhotoshopIllustrator

I developed the frontend web application with React and Webpack, backend with Node.js from the scratch, optimized the SEO with Server Side Rendering technology.

Besides, most of the copywriting and portrait photography and post-production work of this site were completed by myself independently.

Axiom Design System

A design system that integrates good parts of Fluent Design System and Material Design System.

Web ComponentsReact

An ongoing experimental project is attempting to build an efficient and intuitive design system along with related Web Component components.

As a member of this project team, I have successfully implemented several complex visual effects of the Fluent Design System using the latest web technologies. These effects include highlight components, acrylic material, button tilt animations, and common composite shadow containers. By accurately reproducing all the details of the design system, we have made it possible to accurately replicate the web experience in Electron platforms and browsers.

One of the components, the Reveal Highlight, not only implements the highlight effect itself but also extends it to three new shape effects: rounded corners, clipped corners, and concave corners. By utilizing the high-performance Canvas API and employing sophisticated multi-layer texture caching, its performance achieves the desired 60fps frame rate and is currently one of the best-performing implementations.

Additionally, the composite shadow container models the shadow system of Fluent Design by employing linear regression, enabling the creation of shadows with any desired depth. Compared to the traditional limited-level implementations, this API provides greater flexibility for design work.

Design Related

MyCard's Homepage Design

The first second version of the homepage design of the open source MyCard Community.

CSSJavaScriptPhotoshopIllustrator

MyCard YGOPro is an open-source, free Yu-Gi-Oh! card game community, which has been operating for nine years. I participated in the home page design of the first and second edition of the MyCard community website, and completed most of some CSS source code. These two front-end designs have been used for several years, serving a significant number of Yu-Gi-Oh! players.

Since the first and second editions have been downlined for many years, the original design resources have been lost, and the Web Archive has not been able to leave a complete snapshot.

Project Open PPT

A series of PPT design resources that follow the CC-BY 4.0 license.

PowerpointIllustratorPhotoshopAudacity

PPT 的缩略图

A free PPT resource sharing project that follows the CC-BY 4.0 license. This project does not simply share the PPT design template. It focuses on sharing the ideas of PPT content disassembly and rearrangement, visual design skills and motion design skills which can guide the audience's focus and promote the audience's understanding of the content of the speech.

All the PPT resources shared by this project are selected from the literature reports and public speeches I have done in recent years. The visual design and content design are completed by myself independently.

Education & Psychology

R Workshop

A tiny workshop I hosted in November 2018.

RPowerpoint

A tiny workshop I hosted, which aims to make sure the audience knows all basic knowledge of R and the got basic concept of ggplot2 in three hours.

I wrote the tutorial code, prepared the handout, presentation, and host the workshop.

Ancient Classroom

A set of experimental course design of mental health training program.

Node.jsElectronWebSocketReact

Two courses that use different experimental technology to reform the structure of the classical classroom, in one of the course I use Group Counseling Technology to guide students exploring the advantages of themselves and others, in another course, I use students' mobile phone as a media, discovering hobbies with students.

I designed the course, necessary mobile application and presentation program, server program of the course.

WordChallenge R

Word learning management system written in R.

R

A system that helps users manage unfamiliar vocabulary, can automatically generate Chinese-English and English-English vocabulary lists, vocabulary tests, Automatically mark words that are not within the scope of the exam and recurring vocabulary.

I designed the system with deployment document (For the sake of deployment difficulty, this system should be refactored in other programming languages ​​in the future.)

Project Bota

Sandplay therapy under the VR environment.

JavaScriptBlenderIllustrator

A business plan and demo program of a multiple user Sandplay therapy solution, which got "Internet Plus" College Student Business Plan Competition Provincial First Prize in 2015, China College Students' Entrepreneurship Competition, Provincial First Prize, National Second Prize in 2016.

I'm the leader of this project, participated in the preparation of the business plan, the design of the 3D model and the graphic design of the brand and visual system of the project.