Suraj Barthy

<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:media="http://search.yahoo.com/mrss/"
	
	>

<channel>
	<title>Suraj Barthy</title>
	<link>https://barthysuraj.com</link>
	<description>Suraj Barthy</description>
	<pubDate>Fri, 22 Aug 2025 04:36:33 +0000</pubDate>
	<generator>https://barthysuraj.com</generator>
	<language>en</language>
	
		
	<item>
		<title>Launching Microsoft Viva Learning copy</title>
				
		<link>https://barthysuraj.com/Launching-Microsoft-Viva-Learning-copy</link>

		<pubDate>Wed, 13 Aug 2025 16:56:28 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/Launching-Microsoft-Viva-Learning-copy</guid>

		<description>

body {
  font-family: sans-serif; /* Ensuring clarity */
}

.sidenav {
  position: fixed;
  z-index: 1;
  top: 20%; /* Set to the final position */
  left: 90%;
  width: 10%;
  line-height: 2.5;
  overflow-x: hidden;
  padding: 8px 0;
  opacity: 1; /* Start with sidebar hidden */
  transition: opacity 2s; /* Smooth transition for opacity only */
}

.sidenav a {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  line-height: 2.5;
  font-size: small; /* Consistency in appearance */
  color: #f53;
  display: block; /* Ensure links are displayed as block for layout */
}

.sidenav a.active {
  color: #f53;
  text-decoration: none;
  line-height: 2.5;
  font-weight: bold; /* Bold for active link */
}

.sidenav a:hover,
.sidenav a:focus {
  outline: 1px solid #f53; /* Orange outline for visibility */
  outline-offset: -2px; /* Adds space between the outline and the element border */
  color: black;
  text-decoration: none;
  line-height: 2.5;
}

.main {
  padding: 0px 0px;
}

@media screen and (max-width: 1024px) {
  .sidenav {
    display: none;
  }
  .bottomnav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #333;
    padding: 10px 0;
    z-index: 1;
    overflow-x: auto; /* Allow horizontal scrolling */
    white-space: nowrap; /* Prevent items from wrapping */
  }
  .bottomnav span {
    padding: 0 10px;
    color: rgba(255, 255, 255, 0.85);
    font-size: small;
    font-weight: bold;
  }
  .bottomnav a {
    padding: 10px;
    text-decoration: none;
    font-size: small;
    color: #f53;
    display: inline-block; /* Ensure links are displayed inline for scrolling */
  }
  .bottomnav a.active,
  .bottomnav a:hover,
  .bottomnav a:focus {
    outline: none;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.85);
  }
  div[grid-col="2"][grid-pad="3"],
  div[grid-col="3"][grid-pad="3"] {
    display: none; /* Hide empty columns on mobile */
  }

  div[grid-col="7"][grid-pad="3"] {
    grid-col: 12; /* Adjust the middle column to full width */
  }
}

@media screen and (min-width: 1025px) {
  .bottomnav {
    display: none; /* Hide bottomnav on desktop */
  }
}

@media screen and (max-height: 450px) {
  .sidenav {
    padding-top: 15px;
  }
  .sidenav a {
    font-size: smaller;
  }
}


    Go to:
    Role
    Impact
    Overview
    Context
    Challenge
    Research
    Design
    Motion
    Testing
    Decisions
    Influence
    Future
    Reflection
  

  Go directly to:
  Role
  Impact
  Overview
  Context
  Challenge
  Research
  Design
  Motion
  Testing
  Decisions
  Influence
  Future
  Reflection


      Onboarding Microsoft To Do
      
      
        Showing users what they get from To Do without having to log in, through storytelling experiences.
      
    
    Role
    
      As the UX Designer, I:
      
        Led the end-to-end design of the onboarding experience from scratch
        Collaborated with PMs, engineers, and researchers to align on constraints and goals
        Brought motion design into the process to make the first moments with the app feel dynamic and polished
        Facilitated remote usability testing during the early days of the pandemic, adapting methods for unmoderated, distributed participants
      
    
    Impact Snapshot
    
      
        Enabled ~66% of new users in testing to reach the “aha” moment before sign-up, maintaining conversion while unlocking new trust and engagement benefits over the existing account-first flow
        Cut time-to-value to under 2 minutes and ~5 purposeful clicks, faster and more engaging than competitor flows
        Pinpointed why the remaining 34% dropped off and produced a validated concept for exploration-before-sign-up onboarding. This was not shipped due to pandemic reorgs, but the findings informed later onboarding experiments within To Do
      
      
    Highlights
  
  
    &#60;img width="750" height="1625" width_o="750" height_o="1625" data-src="https://freight.cargo.site/t/original/i/72415ddcf7783bf12358d42b2723c501dfdc209ac09f61002451eaf0a1b70d4a/reminders_spotlight_loop.gif" data-mid="236998924" border="0"  src="https://freight.cargo.site/w/750/i/72415ddcf7783bf12358d42b2723c501dfdc209ac09f61002451eaf0a1b70d4a/reminders_spotlight_loop.gif" /&#62;
    &#60;img width="750" height="1625" width_o="750" height_o="1625" data-src="https://freight.cargo.site/t/original/i/0d793ccecc54494434d3a71e35ff3fbee1a0961028af8cbe39260ce283a287eb/Sharing_spotlight.gif" data-mid="236998923" border="0"  src="https://freight.cargo.site/w/750/i/0d793ccecc54494434d3a71e35ff3fbee1a0961028af8cbe39260ce283a287eb/Sharing_spotlight.gif" /&#62;
    &#60;img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/4c4ccd49113d39adb6286c6682dbe2ea3026223a67b9f803da866db351e9d656/proto_success_loop.gif" data-mid="236998921" border="0"  src="https://freight.cargo.site/w/750/i/4c4ccd49113d39adb6286c6682dbe2ea3026223a67b9f803da866db351e9d656/proto_success_loop.gif" /&#62;
    &#60;img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/b7831ad54e09aadf6fd790faf2c9166e3d0d5d27cea6824c79ebb0cc9a4ccade/proto_loop.gif" data-mid="236998927" border="0"  src="https://freight.cargo.site/w/750/i/b7831ad54e09aadf6fd790faf2c9166e3d0d5d27cea6824c79ebb0cc9a4ccade/proto_loop.gif" /&#62;
  
  
&#38;nbsp;
      
    
         Final Proposal video for user testing - Onboarding Proposal - Microsoft To Do

  
    Project Overview
    
      Microsoft To Do required users to sign up before they could see any part of the product. For a productivity app, this created a major trust and friction barrier. My task was to design an onboarding experience that let people explore value before committing, without breaking Microsoft’s account-first ecosystem.&#60;img width="1204" height="632" width_o="1204" height_o="632" data-src="https://freight.cargo.site/t/original/i/e9bc8614033633dbefbbb493a7292d3d86c379969943b3ed86278f03bfcdfbdc/Onboarding.gif" data-mid="236998919" border="0"  src="https://freight.cargo.site/w/1000/i/e9bc8614033633dbefbbb493a7292d3d86c379969943b3ed86278f03bfcdfbdc/Onboarding.gif" /&#62;

    
    Context
    
      When Wunderlist joined Microsoft, we set out to combine its simplicity with Microsoft’s ecosystem power. In the process, we inherited a mandatory sign-up wall.
      
      By 2020, To Do was seeing:
      
        60% sign-up rate post-download, far below the 80 to 90% common in competitor apps
        A growing list of user complaints about being forced to create a Microsoft account to even try the app
      
      We had no onboarding at all, only a sign-in screen. The absence of any preview was hurting adoption and trust.

    
    Challenge
    
      Business problem: The onboarding funnel was “skinny,” with too few users making it past the first screen.
      
      User problem: Productivity tools are personal, and users were not willing to commit without knowing if To Do fit into their workflow.
      
      “Maybe I can use the app without having an account.” User feedback

&#60;img width="3066" height="1725" width_o="3066" height_o="1725" data-src="https://freight.cargo.site/t/original/i/9120ab0a0123bc183dfe4a5df7397e2aab00247aa2cb646bf61c82868f9d6e1e/todo.png" data-mid="236998916" border="0"  src="https://freight.cargo.site/w/1000/i/9120ab0a0123bc183dfe4a5df7397e2aab00247aa2cb646bf61c82868f9d6e1e/todo.png" /&#62;

    
    Research
    
      I ran a competitive scan of onboarding flows from leading productivity apps. Two consistent friction points emerged:
      
        Mandatory sign-up before showing value
        Extra step of creating a Microsoft or Hotmail account for new users
      
      We also identified that “My Day” was To Do’s most unique and sticky feature, a daily reset list to plan your day. This made it a strong candidate for onboarding focus.
&#38;nbsp;
  

    Design Directions
    
      I explored four flow options, mixing carousels, coachmarks, customization, and a welcome list:
      
        Carousel and coachmarks
        Customization and coachmarks
        Carousel, customization, and coachmarks
        Welcome list and coachmarks
      
      
      &#60;img width="1204" height="632" width_o="1204" height_o="632" data-src="https://freight.cargo.site/t/original/i/ed4fb6eaf35ec628e3edb50c69c51f3dcb0b0424549b737f1f73c4eee797184f/OnboardinType.png" data-mid="236998920" border="0"  src="https://freight.cargo.site/w/1000/i/ed4fb6eaf35ec628e3edb50c69c51f3dcb0b0424549b737f1f73c4eee797184f/OnboardinType.png" /&#62;&#38;nbsp;
      Additionally, the My Day feature is unique to Microsoft To Do. It provides a fresh, clean list every day so you can plan tasks that need immediate attention. This direction showed value by introducing users directly to My Day.
      
&#60;img width="726" height="418" width_o="726" height_o="418" data-src="https://freight.cargo.site/t/original/i/fc2a5cf41efd2fcda63bcd7bf20d85b35dc88b456ee79afd254f573bee4499c0/onboarding.png" data-mid="236998918" border="0"  src="https://freight.cargo.site/w/726/i/fc2a5cf41efd2fcda63bcd7bf20d85b35dc88b456ee79afd254f573bee4499c0/onboarding.png" /&#62;


      Flow 1 - Carousel, coachmarks&#60;img width="7700" height="1012" width_o="7700" height_o="1012" data-src="https://freight.cargo.site/t/original/i/482c6103be7402f5abf2bb223ed44271b70d2b3157211caca73fcae5f616e394/flow-1.png" data-mid="236999183" border="0"  src="https://freight.cargo.site/w/1000/i/482c6103be7402f5abf2bb223ed44271b70d2b3157211caca73fcae5f616e394/flow-1.png" /&#62;
      Flow 2 - Customization, coachmarks&#60;img width="7700" height="1012" width_o="7700" height_o="1012" data-src="https://freight.cargo.site/t/original/i/777fabf993a5beb6c8e10d256b3870621111e03874a0ec2b0d74107a0f6d38e2/flow-2.png" data-mid="236999184" border="0"  src="https://freight.cargo.site/w/1000/i/777fabf993a5beb6c8e10d256b3870621111e03874a0ec2b0d74107a0f6d38e2/flow-2.png" /&#62;
      Flow 3 - Carousel, customization, coachmarks&#60;img width="5325" height="1012" width_o="5325" height_o="1012" data-src="https://freight.cargo.site/t/original/i/74c84ba360ba46126db01e67aa7c306010002e3e1d5fc9aa2b7b5235696cd53b/flow-3.png" data-mid="236999185" border="0"  src="https://freight.cargo.site/w/1000/i/74c84ba360ba46126db01e67aa7c306010002e3e1d5fc9aa2b7b5235696cd53b/flow-3.png" /&#62;
      Flow 4 - Welcome list, coachmarks&#60;img width="2475" height="1012" width_o="2475" height_o="1012" data-src="https://freight.cargo.site/t/original/i/1eca70ff370a10679ea0f12aef742dcd30fb8c5bf6657a7599a61e103654615a/flow-4.png" data-mid="236999186" border="0"  src="https://freight.cargo.site/w/1000/i/1eca70ff370a10679ea0f12aef742dcd30fb8c5bf6657a7599a61e103654615a/flow-4.png" /&#62;
    

    Motion
    
      Motion design was a key part of my process. Onboarding is one of the areas where motion can help or hurt. I started with the coachmark areas and developed ideas to make them more dynamic.
      

	&#60;img width="750" height="1625" width_o="750" height_o="1625" data-src="https://freight.cargo.site/t/original/i/72415ddcf7783bf12358d42b2723c501dfdc209ac09f61002451eaf0a1b70d4a/reminders_spotlight_loop.gif" data-mid="236998924" border="0"  src="https://freight.cargo.site/w/750/i/72415ddcf7783bf12358d42b2723c501dfdc209ac09f61002451eaf0a1b70d4a/reminders_spotlight_loop.gif" /&#62;
	&#60;img width="750" height="1625" width_o="750" height_o="1625" data-src="https://freight.cargo.site/t/original/i/0d793ccecc54494434d3a71e35ff3fbee1a0961028af8cbe39260ce283a287eb/Sharing_spotlight.gif" data-mid="236998923" border="0"  src="https://freight.cargo.site/w/750/i/0d793ccecc54494434d3a71e35ff3fbee1a0961028af8cbe39260ce283a287eb/Sharing_spotlight.gif" /&#62;
	&#60;img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/4c4ccd49113d39adb6286c6682dbe2ea3026223a67b9f803da866db351e9d656/proto_success_loop.gif" data-mid="236998921" border="0"  src="https://freight.cargo.site/w/750/i/4c4ccd49113d39adb6286c6682dbe2ea3026223a67b9f803da866db351e9d656/proto_success_loop.gif" /&#62;
	&#60;img width="750" height="1624" width_o="750" height_o="1624" data-src="https://freight.cargo.site/t/original/i/b7831ad54e09aadf6fd790faf2c9166e3d0d5d27cea6824c79ebb0cc9a4ccade/proto_loop.gif" data-mid="236998927" border="0"  src="https://freight.cargo.site/w/750/i/b7831ad54e09aadf6fd790faf2c9166e3d0d5d27cea6824c79ebb0cc9a4ccade/proto_loop.gif" /&#62;

  
	Motion Prototypes
	The next step was bringing the motion directions into the flows and get them ready for testing.


      Onboarding Flow 1
    
    
      Onboarding Flow 2
    
    
      Onboarding Flow 3
    
  
        Final Proposal for User Testing
 
      
Onboarding Proposal - Microsoft To Do

  
    Testing
    
      We tested the prototype remotely with 8 participants on usertesting.com, and asked them to think aloud as they explored the flow.
      Data

      Prototype success rate: about 66% reached “aha” without dropping out.
      
      Top drop-off causes:
      
        Copy clarity issues, with icons and text misunderstood
        Optional step confusion, where skip behavior led to missed required interactions
        Testing artifacts, including distractions in unmoderated sessions
        Minor UI friction, such as unclear tap targets and pacing
&#38;nbsp;
  

&#60;img width="1260" height="1656" width_o="1260" height_o="1656" data-src="https://freight.cargo.site/t/original/i/ca6dab902542ec0a43120bd79caea6126e7af3d40b8e6d8ca9b2cee9e8e6016e/MicrosoftTeams-image-2.png" data-mid="236998930" border="0"  src="https://freight.cargo.site/w/1000/i/ca6dab902542ec0a43120bd79caea6126e7af3d40b8e6d8ca9b2cee9e8e6016e/MicrosoftTeams-image-2.png" /&#62;
&#60;img width="2282" height="1596" width_o="2282" height_o="1596" data-src="https://freight.cargo.site/t/original/i/91802ec713ae139896ebbf147f09401b4982d12106993d64a4065e4581aba8f3/MicrosoftTeams-image-6.png" data-mid="236998934" border="0"  src="https://freight.cargo.site/w/1000/i/91802ec713ae139896ebbf147f09401b4982d12106993d64a4065e4581aba8f3/MicrosoftTeams-image-6.png" /&#62;
&#60;img width="1788" height="1622" width_o="1788" height_o="1622" data-src="https://freight.cargo.site/t/original/i/259d94a81d1754368454c2b4372c87bb533914c9ec0e5f30bb03fa8fd7e64f54/MicrosoftTeams-image-5.png" data-mid="236998933" border="0"  src="https://freight.cargo.site/w/1000/i/259d94a81d1754368454c2b4372c87bb533914c9ec0e5f30bb03fa8fd7e64f54/MicrosoftTeams-image-5.png" /&#62;
&#60;img width="1884" height="1302" width_o="1884" height_o="1302" data-src="https://freight.cargo.site/t/original/i/ca76c1311cefb6266df97c0530c9d951631ddba8a19fe295ef3707f262395f3c/MicrosoftTeams-image-4.png" data-mid="236998932" border="0"  src="https://freight.cargo.site/w/1000/i/ca76c1311cefb6266df97c0530c9d951631ddba8a19fe295ef3707f262395f3c/MicrosoftTeams-image-4.png" /&#62;
&#60;img width="1934" height="1330" width_o="1934" height_o="1330" data-src="https://freight.cargo.site/t/original/i/2b53525566386fb0706a392445883941a41caedf93c2d0408012b06fd395233c/MicrosoftTeams-image-3.png" data-mid="236998931" border="0"  src="https://freight.cargo.site/w/1000/i/2b53525566386fb0706a392445883941a41caedf93c2d0408012b06fd395233c/MicrosoftTeams-image-3.png" /&#62;

    
	Insights
	My background as a Data Analyst helped me sift through the noise and find insights that helped improve the next iteration of the flow.

  
	&#60;img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/20d0e724b46acc19b6d890631274a007760d6934980a8e4475cce2c326079071/33.jpg" data-mid="236998935" border="0"  src="https://freight.cargo.site/w/1000/i/20d0e724b46acc19b6d890631274a007760d6934980a8e4475cce2c326079071/33.jpg" /&#62;&#60;img width="1920" height="1610" width_o="1920" height_o="1610" data-src="https://freight.cargo.site/t/original/i/d6fe1596aaf22caa156e05b56324fdd185da2b81c49f60fda7356cf0ee52721b/34.jpg" data-mid="236998936" border="0"  src="https://freight.cargo.site/w/1000/i/d6fe1596aaf22caa156e05b56324fdd185da2b81c49f60fda7356cf0ee52721b/34.jpg" /&#62;&#60;img width="1920" height="1185" width_o="1920" height_o="1185" data-src="https://freight.cargo.site/t/original/i/09aaf9359ab8e3a73d7c3834a1fea13ea3ba5721484663b00e174d393e0fa591/35.jpg" data-mid="236998937" border="0"  src="https://freight.cargo.site/w/1000/i/09aaf9359ab8e3a73d7c3834a1fea13ea3ba5721484663b00e174d393e0fa591/35.jpg" /&#62;&#60;img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/23af91e5cfd2bbe2b10fada37b7618c8799388ae89464c76b3c0477f98d812be/38.jpg" data-mid="236998940" border="0"  src="https://freight.cargo.site/w/1000/i/23af91e5cfd2bbe2b10fada37b7618c8799388ae89464c76b3c0477f98d812be/38.jpg" /&#62;&#60;img width="1920" height="1754" width_o="1920" height_o="1754" data-src="https://freight.cargo.site/t/original/i/5f70dd450d041baacb2402f743170da8df180c2220c2f5576a610dfb7212e1bd/36.jpg" data-mid="236998938" border="0"  src="https://freight.cargo.site/w/1000/i/5f70dd450d041baacb2402f743170da8df180c2220c2f5576a610dfb7212e1bd/36.jpg" /&#62;&#60;img width="1920" height="1593" width_o="1920" height_o="1593" data-src="https://freight.cargo.site/t/original/i/5daffbb045268cbc1dda25c94b17a1453a0ab91ea24acca7621ee3fc389018f2/37.jpg" data-mid="236998939" border="0"  src="https://freight.cargo.site/w/1000/i/5daffbb045268cbc1dda25c94b17a1453a0ab91ea24acca7621ee3fc389018f2/37.jpg" /&#62;

  
	Important Insights
	&#60;img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/f79b573cc4e6ac9e0b545d4d23db11157270c8a2fba86a2a024deeb0b774063e/14.jpg" data-mid="236998941" border="0"  src="https://freight.cargo.site/w/1000/i/f79b573cc4e6ac9e0b545d4d23db11157270c8a2fba86a2a024deeb0b774063e/14.jpg" /&#62;

  
	Relevant to our Exercise
	&#60;img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/9036e59058f3e046e14fd22a0324da018eee0c5d86569768cb2357b35754c779/15.jpg" data-mid="236998942" border="0"  src="https://freight.cargo.site/w/1000/i/9036e59058f3e046e14fd22a0324da018eee0c5d86569768cb2357b35754c779/15.jpg" /&#62;

  
    Key Decisions and Trade-offs
    
      
        Chose Flow 3 for a balance of speed and personalization
        Reduced certain customization prompts to decrease friction
        Recommended a modular onboarding that could adapt by platform
      
    
    My Influence
    
      
        Advocated for exploration before sign-up as a viable business path
        Introduced motion design to onboarding for the first time in To Do
        Aligned product, design, and engineering on a testable MVP
      
    
    Future Impact
    
      The flow was paused due to COVID-19 reorgs and shifting priorities. The research and design artifacts later informed onboarding experiments within Microsoft To Do.
    
  
    Reflection
    
      This project taught me to:
      
        Build an onboarding system from scratch within an account-first ecosystem
        Adapt quickly to remote testing and collaboration
        Use motion as a functional onboarding tool, not just an aesthetic layer
        Turn small-sample usability insights into clear design changes
      
    
document.addEventListener("DOMContentLoaded", function() {
  const links = document.querySelectorAll('.sidenav a[href^="#"]');

  function adjustSidebarPosition() {
    let lastPassedSectionIndex = -1;

    links.forEach((link, index) =&#62; {
      const refElement = document.getElementById(link.getAttribute('href').substring(1));
      if (refElement) {
        const bounds = refElement.getBoundingClientRect();
        if (bounds.top  {
      link.classList.toggle('active', index === lastPassedSectionIndex);
    });
  }

  window.addEventListener('scroll', adjustSidebarPosition);
});
</description>
		
	</item>
		
		
	<item>
		<title>banner image</title>
				
		<link>https://barthysuraj.com/banner-image</link>

		<pubDate>Wed, 06 Aug 2025 00:17:08 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/banner-image</guid>

		<description>
	&#60;img width="1536" height="1920" width_o="1536" height_o="1920" data-src="https://freight.cargo.site/t/original/i/2df279746703149e7353031beea4b107d1d0d99f2897fab46dbadbfc16694cbc/suraj_music_round.png" data-mid="236696381" border="0" data-scale="80" src="https://freight.cargo.site/w/1000/i/2df279746703149e7353031beea4b107d1d0d99f2897fab46dbadbfc16694cbc/suraj_music_round.png" /&#62;

	Product designer and 3D artist creating accessible, data-informed experiences at Quit with Jones and exploring&#38;nbsp;AI agents to automate everyday life.
I also make clocks when I have time.


</description>
		
	</item>
		
		
	<item>
		<title>logos copy copy</title>
				
		<link>https://barthysuraj.com/logos-copy-copy</link>

		<pubDate>Tue, 05 Aug 2025 07:59:52 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/logos-copy-copy</guid>

		<description>
  

      &#60;img width="300" height="96" width_o="300" height_o="96" data-src="https://freight.cargo.site/t/original/i/3a1b3c1d3966e8607e0245b55ec7cb0ddc081e0b76a7736bd06b9b3ddd55c6bd/weblogo_separate-01.svg" data-mid="236666009" border="0" data-scale="3" data-icon-mode alt="Microsoft" data-caption="Microsoft" src="https://freight.cargo.site/w/300/i/3a1b3c1d3966e8607e0245b55ec7cb0ddc081e0b76a7736bd06b9b3ddd55c6bd/weblogo_separate-01.svg" /&#62;
    
    
      &#60;img width="300" height="94" width_o="300" height_o="94" data-src="https://freight.cargo.site/t/original/i/a7907a3b3bd0fcd8ca6ad1fe5833bba3a58af9cbb0f2c685db5c0f673e3f904a/weblogo_separate-02.svg" data-mid="236666007" border="0" data-scale="3" data-icon-mode alt="Samsung" data-caption="Samsung" src="https://freight.cargo.site/w/300/i/a7907a3b3bd0fcd8ca6ad1fe5833bba3a58af9cbb0f2c685db5c0f673e3f904a/weblogo_separate-02.svg" /&#62;
    
    
      &#60;img width="300" height="113" width_o="300" height_o="113" data-src="https://freight.cargo.site/t/original/i/88e6fdafc6ec852842efa010ea27a5e83eaacd1334d40d1c72a7097c794aabdd/weblogo_separate-03.svg" data-mid="236666006" border="0" data-scale="3" data-icon-mode alt="Urban Ladder" data-caption="Urban Ladder" src="https://freight.cargo.site/w/300/i/88e6fdafc6ec852842efa010ea27a5e83eaacd1334d40d1c72a7097c794aabdd/weblogo_separate-03.svg" /&#62;
    
    
      &#60;img width="300" height="88" width_o="300" height_o="88" data-src="https://freight.cargo.site/t/original/i/7029df68cc3141269c39081d896a9bdb63d7de315b5037abd2cd3eb5b9152811/weblogo_separate-04.svg" data-mid="236666008" border="0" data-scale="3" data-icon-mode alt="NYU Tisch" data-caption="NYU Tisch" src="https://freight.cargo.site/w/300/i/7029df68cc3141269c39081d896a9bdb63d7de315b5037abd2cd3eb5b9152811/weblogo_separate-04.svg" /&#62;
    
    
      &#60;img width="116" height="150" width_o="116" height_o="150" data-src="https://freight.cargo.site/t/original/i/caabb24e9d68013641cd0e0728656f5669fe845519cc1adffbc280979391add3/weblogo_separate-05.svg" data-mid="236666010" border="0" data-scale="3" data-icon-mode alt="NID" data-caption="NID" src="https://freight.cargo.site/w/116/i/caabb24e9d68013641cd0e0728656f5669fe845519cc1adffbc280979391add3/weblogo_separate-05.svg" /&#62;
    
    
      &#60;img width="611" height="170" width_o="611" height_o="170" data-src="https://freight.cargo.site/t/original/i/566256a6aaf7403fcb6e836adccb8d6a45abee23201fcfbcb8bc89a48ecceb86/stern_black_rgb-1.svg" data-mid="236683878" border="0" data-scale="3" data-icon-mode alt="NYU Stern" data-caption="NYU Stern" src="https://freight.cargo.site/w/611/i/566256a6aaf7403fcb6e836adccb8d6a45abee23201fcfbcb8bc89a48ecceb86/stern_black_rgb-1.svg" /&#62;
    

      &#60;img width="951" height="170" width_o="951" height_o="170" data-src="https://freight.cargo.site/t/original/i/8f293d2d569bd869009b260cc3870b30a6ab39db8a92c065e5f1862ad8457b82/efl.svg" data-mid="236667617" border="0" data-scale="3" data-icon-mode alt="Endless Frontier Labs" data-caption="Endless Frontier Labs" src="https://freight.cargo.site/w/951/i/8f293d2d569bd869009b260cc3870b30a6ab39db8a92c065e5f1862ad8457b82/efl.svg" /&#62;
    
    
      &#60;img width="233" height="170" width_o="233" height_o="170" data-src="https://freight.cargo.site/t/original/i/7e9d8d4a4ee5b5a7c769676228c192dfba826490c7323a26cf40e1a86b6d2b3e/zolo.svg" data-mid="236667618" border="0" data-scale="3" data-icon-mode alt="Zolostays" data-caption="Zolostays" src="https://freight.cargo.site/w/233/i/7e9d8d4a4ee5b5a7c769676228c192dfba826490c7323a26cf40e1a86b6d2b3e/zolo.svg" /&#62;
    
    
      &#60;img width="559" height="171" width_o="559" height_o="171" data-src="https://freight.cargo.site/t/original/i/896c4fdd17f07e935170450e8003e7ea2b7d8907e7f2fb2b0cb56425f748c4c8/lv.svg" data-mid="236667619" border="0" data-scale="3" data-icon-mode alt="LatentView Analytics" data-caption="LatentView Analytics" src="https://freight.cargo.site/w/559/i/896c4fdd17f07e935170450e8003e7ea2b7d8907e7f2fb2b0cb56425f748c4c8/lv.svg" /&#62;
    

      &#60;img width="300" height="96" width_o="300" height_o="96" data-src="https://freight.cargo.site/t/original/i/3a1b3c1d3966e8607e0245b55ec7cb0ddc081e0b76a7736bd06b9b3ddd55c6bd/weblogo_separate-01.svg" data-mid="236666009" border="0" data-scale="3" data-icon-mode alt="Microsoft" data-caption="Microsoft" src="https://freight.cargo.site/w/300/i/3a1b3c1d3966e8607e0245b55ec7cb0ddc081e0b76a7736bd06b9b3ddd55c6bd/weblogo_separate-01.svg" /&#62;
    
    
      &#60;img width="300" height="94" width_o="300" height_o="94" data-src="https://freight.cargo.site/t/original/i/a7907a3b3bd0fcd8ca6ad1fe5833bba3a58af9cbb0f2c685db5c0f673e3f904a/weblogo_separate-02.svg" data-mid="236666007" border="0" data-scale="3" data-icon-mode alt="Samsung" data-caption="Samsung" src="https://freight.cargo.site/w/300/i/a7907a3b3bd0fcd8ca6ad1fe5833bba3a58af9cbb0f2c685db5c0f673e3f904a/weblogo_separate-02.svg" /&#62;
    
    
      &#60;img width="300" height="113" width_o="300" height_o="113" data-src="https://freight.cargo.site/t/original/i/88e6fdafc6ec852842efa010ea27a5e83eaacd1334d40d1c72a7097c794aabdd/weblogo_separate-03.svg" data-mid="236666006" border="0" data-scale="3" data-icon-mode alt="Urban Ladder" data-caption="Urban Ladder" src="https://freight.cargo.site/w/300/i/88e6fdafc6ec852842efa010ea27a5e83eaacd1334d40d1c72a7097c794aabdd/weblogo_separate-03.svg" /&#62;
    
    
      &#60;img width="300" height="88" width_o="300" height_o="88" data-src="https://freight.cargo.site/t/original/i/7029df68cc3141269c39081d896a9bdb63d7de315b5037abd2cd3eb5b9152811/weblogo_separate-04.svg" data-mid="236666008" border="0" data-scale="3" data-icon-mode alt="NYU Tisch" data-caption="NYU Tisch" src="https://freight.cargo.site/w/300/i/7029df68cc3141269c39081d896a9bdb63d7de315b5037abd2cd3eb5b9152811/weblogo_separate-04.svg" /&#62;
    
    
      &#60;img width="116" height="150" width_o="116" height_o="150" data-src="https://freight.cargo.site/t/original/i/caabb24e9d68013641cd0e0728656f5669fe845519cc1adffbc280979391add3/weblogo_separate-05.svg" data-mid="236666010" border="0" data-scale="3" data-icon-mode alt="NID" data-caption="NID" src="https://freight.cargo.site/w/116/i/caabb24e9d68013641cd0e0728656f5669fe845519cc1adffbc280979391add3/weblogo_separate-05.svg" /&#62;
    
        
      &#60;img width="611" height="170" width_o="611" height_o="170" data-src="https://freight.cargo.site/t/original/i/566256a6aaf7403fcb6e836adccb8d6a45abee23201fcfbcb8bc89a48ecceb86/stern_black_rgb-1.svg" data-mid="236683878" border="0" data-scale="3" data-icon-mode alt="NYU Stern" data-caption="NYU Stern" src="https://freight.cargo.site/w/611/i/566256a6aaf7403fcb6e836adccb8d6a45abee23201fcfbcb8bc89a48ecceb86/stern_black_rgb-1.svg" /&#62;
    
        
      &#60;img width="951" height="170" width_o="951" height_o="170" data-src="https://freight.cargo.site/t/original/i/8f293d2d569bd869009b260cc3870b30a6ab39db8a92c065e5f1862ad8457b82/efl.svg" data-mid="236667617" border="0" data-scale="3" data-icon-mode alt="Endless Frontier Labs" data-caption="Endless Frontier Labs" src="https://freight.cargo.site/w/951/i/8f293d2d569bd869009b260cc3870b30a6ab39db8a92c065e5f1862ad8457b82/efl.svg" /&#62;
    
    
      &#60;img width="233" height="170" width_o="233" height_o="170" data-src="https://freight.cargo.site/t/original/i/7e9d8d4a4ee5b5a7c769676228c192dfba826490c7323a26cf40e1a86b6d2b3e/zolo.svg" data-mid="236667618" border="0" data-scale="3" data-icon-mode alt="Zolostays" data-caption="Zolostays" src="https://freight.cargo.site/w/233/i/7e9d8d4a4ee5b5a7c769676228c192dfba826490c7323a26cf40e1a86b6d2b3e/zolo.svg" /&#62;
    
    
      &#60;img width="559" height="171" width_o="559" height_o="171" data-src="https://freight.cargo.site/t/original/i/896c4fdd17f07e935170450e8003e7ea2b7d8907e7f2fb2b0cb56425f748c4c8/lv.svg" data-mid="236667619" border="0" data-scale="3" data-icon-mode alt="LatentView Analytics" data-caption="LatentView Analytics" src="https://freight.cargo.site/w/559/i/896c4fdd17f07e935170450e8003e7ea2b7d8907e7f2fb2b0cb56425f748c4c8/lv.svg" /&#62;
    

@keyframes scroll-left {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
</description>
		
	</item>
		
		
	<item>
		<title>index2 copy</title>
				
		<link>https://barthysuraj.com/index2-copy</link>

		<pubDate>Tue, 05 Aug 2025 05:50:03 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/index2-copy</guid>

		<description>


      Current Exploration: Art Critic AI Agent
    
  
      Launching Microsoft Viva Learning
      
        Led the end-to-end design of the mobile app from 0 to 1 for iOS and Android, crafting all user flows with a strong emphasis on Accessibility.
      
      0 to 1, iOS, android, desktop, accessibility, enterprise
    
  
      Quit with Jones ︎︎︎
      
        Leading the redesign, new feature development, and design system creation for an app aimed at helping users quit nicotine, with a focus on habit formation.
      
      iOS, android, retention, user research, habit formation, consumer
    
  
      Onboarding Microsoft To Do
      Designed a dynamic onboarding flow increasing feature discovery.
      iOS, android, onboarding, motion design, activation
    
  
      Onboarding Wooplr
      Revamped onboarding and added features, boosting engagement and reducing churn.
      Android, onboarding, motion design, activation
    
  
      Everyday GAN
      Explored GANs through my Everyday Project by generating images from the first 2285 days.
      GAN, GenAI, Colab, Data
    
  
      Ponged
      Created an experience for friends to share and "catch" sounds spatially using their phones.
      Spatial sound, audio UX, immersion, interaction design
    
  
    Everyday Art Practice
  
  
    Creative Tech Praxis
  
</description>
		
	</item>
		
		
	<item>
		<title>Now</title>
				
		<link>https://barthysuraj.com/Now</link>

		<pubDate>Mon, 04 Aug 2025 03:15:32 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/Now</guid>

		<description>
    
    What Am I Doing Now?
    
        ul {
            list-style-type: disc; /* Changes list markers to bullets */
            margin: 0; /* Removes extra space around the list */
            padding-left: 20px; /* Adds space to align bullets nicely */
            line-height: 1.5; /* Adjusts line height for better readability */
        }

        li {
            margin-bottom: 0.5em; /* Adds spacing between list items */
        }
    

            What am I doing now?
            
                
                        ︎ 
                        ︎ 
                        ︎
                    
                    
                        I am in New York, New York trying to do good work and lead a life that keeps me connected to the people I love.
                        This is what I spend my time doing:
                        
                            Trying to get back time by automating parts of my life with AI agents.Trying to focus on my health after my ACL reconstruction surgery.
                            Being homesick.
                            Trying to do justice to my Booket list.
                            Thinking of the 10th year of my Everyday Project.
                            Noodling everyday. 🎹
                            Focusing on my research on time, connectedness, and technology in my art practice.
                            Thinking way too much about way too many things.
                        
                        
                        These are my main priorities right now.
                        Learn Something New Every Day. If my activities or priorities happen to change, I will update this page to reflect those changes. The last update was on December 28, 2024. Also, does ‘Thinking’ count as an action word? This page is a public declaration and a reminder to myself. It was inspired by Derek Sivers.
        
        
            &#60;img width="1356" height="2048" width_o="1356" height_o="2048" data-src="https://freight.cargo.site/t/original/i/1b34dcc5279c662553cc653d4690525bc33267dff2ab44df2b9b50ed6b6bbf86/suraj_music.JPG" data-mid="236626971" border="0"  src="https://freight.cargo.site/w/1000/i/1b34dcc5279c662553cc653d4690525bc33267dff2ab44df2b9b50ed6b6bbf86/suraj_music.JPG" /&#62;
        
    </description>
		
	</item>
		
		
	<item>
		<title>Playbook</title>
				
		<link>https://barthysuraj.com/Playbook</link>

		<pubDate>Mon, 04 Aug 2025 03:15:33 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/Playbook</guid>

		<description>
    
    Playbook
    
        body {
            font-family: sans-serif; /* Ensuring clarity */
            line-height: 1.6;

            margin: 0;
            padding: 0;
        }

        .card-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
            gap: 16px;
            padding: 0px;
        }

        .card {

            border-radius: 18px;
            padding: 36px;
            background-color: #ececec;
        }

        @media screen and (min-width: 600px) {
            .card-container {
                grid-template-columns: repeat(2, 1fr); /* Two columns when the screen is wider than 600px */
            }
        }

        @media screen and (max-width: 599px) {
            .card-container {
                grid-template-columns: 1fr; /* One column when the screen is 599px or smaller */
            }
        }

   .card h1 {
            
          
        }
        
                a {
            color: #0066cc; /* Ensuring good contrast and recognizable link color */
        }

        a:hover, button:hover, input:hover, textarea:hover, select:hover, a:focus, button:focus, input:focus, textarea:focus, select:focus {
    outline: 1px solid #FF5533; /* Blue outline for visibility */
    outline-offset: 2px; /* Adds space between the outline and the element border */
}

    
    PlaybookThis is the first attempt to put my praxis into words for myself. It is to give you an idea of how I think about design. This is an evolving page and last updated on May 16, 2024. Please feel free to share your thoughts, concerns, or desires.
    
        
            Vision and Philosophy
            Human-Centric &#38;amp; Inclusive Design: Prioritize empathy and accessibility, ensuring designs meet the diverse needs of all users.
            Artistic Integration: Blend technology with traditional art forms, exploring new media to enrich design projects.
            Legacy and Impact: Focus on creating designs that have a lasting impact and foster growth both personally and professionally.
        

            Strategic Research
            Mixed-Methods Research: Employ both qualitative and quantitative research to gain comprehensive insights.
            Cultural Context: Deeply understand the cultural and historical context to ensure design relevance.
            Tech Trends: Stay updated on emerging technologies, exploring their transformative potential.
        

            Creative Process
            Idea Generation: Utilize various creative techniques to spark innovative ideas.
            Rapid Prototyping: Quickly translate ideas into tangible prototypes using a variety of tools, effectively bridging the gap between concept and creation.
            Data-Driven Design: Leverage analytics to inform design decisions and communicate the value and functionality of designs to stakeholders.
            Agile Prototyping: Implement agile development techniques to produce prototypes rapidly, allowing for immediate testing and refinement based on real user interactions.
        

            Technology and Tools
            Adoption of New Technologies: Integrate emerging technologies into design practices.
            Coding Skills: Enhance interactive prototyping with coding in HTML, CSS, JavaScript, and other relevant technologies.
            Software Proficiency: Learn packages and tools across areas (2D, 3D, Motion, UX, Data) to have the ability to convey ideas quickly and for high-fidelity design execution.
        

            Collaboration and Communication
            Team Dynamics: Foster an open, collaborative environment in-person and online to enhance teamwork.
            Effective Stakeholder Communication: Develop effective communication strategies to align with client visions and gather feedback.
            Presentation Skills: Refine presenting techniques to clearly and persuasively convey design concepts to stakeholders.Cross-disciplinary Integration:&#38;nbsp;Draw insights from diverse fields to enrich design thinking and ensure innovative, contextually appropriate solutions.


            Ethical and Sustainable Design
            Sustainability: Integrate sustainable practices into all design decisions, considering environmental impacts.
            Ethics in Design: Uphold the highest standards of ethics, evaluating the societal impacts of design choices.
            Accessibility First: Ensure all designs are accessible to everyone, incorporating accessibility from the onset.
        

            Learning and Adapting
            Continuous Learning: Engage in ongoing education in design, technology, and market trends.
            Feedback Integration: Establish mechanisms for ongoing feedback to continuously refine processes and designs.
            Experimentation and Innovation: Foster a culture of experimentation, exploring new ideas fast and learn from them if they fail.
        
    </description>
		
	</item>
		
		
	<item>
		<title>AI Agent Explorations</title>
				
		<link>https://barthysuraj.com/AI-Agent-Explorations</link>

		<pubDate>Mon, 04 Aug 2025 03:15:42 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/AI-Agent-Explorations</guid>

		<description>

body {
  font-family: sans-serif;
}

.video-full-width {
  width: 100%;
  height: auto;
  border-radius: 18px;
}

.sidenav {
  font-size: small;
  color: rgba(255, 255, 255, 0.85);
  width: 10%;
  position: fixed;
  z-index: 1;
  top: 20%;
  left: 90%;
  line-height: 2.5;
  overflow-x: hidden;
  padding: 8px 0;
  opacity: 1;
  transition: opacity 2s;
}

.sidenav a,
.sidenav span {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  line-height: 2.5;
  font-size: small;
  color: #f53;
  display: block;
}

.sidenav span {
  font-weight: bold;
  color: rgba(255, 255, 255, 0.85);
}

.sidenav a.active {
  color: #f53;
  text-decoration: none;
  line-height: 2.5;
  font-weight: bold; /* Bold for active link */
}

.sidenav a:hover,
.sidenav a:focus {
  outline: 1px solid #f53; /* Orange outline for visibility */
  outline-offset: -2px; /* Adds space between the outline and the element border */
  color: black;
  text-decoration: none;
  line-height: 2.5;
 
}
.main {
  padding: 0px 0px;
}

@media screen and (max-width: 1024px) {
  .sidenav {
    display: none;
  }
  .bottomnav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #333;
    padding: 10px 0;
    z-index: 1;
    overflow-x: auto;
    white-space: nowrap;
  }
  .bottomnav span {
    padding: 0 10px;
    color: rgba(255, 255, 255, 0.85);
    font-size: small;
    font-weight: bold;
  }
  .bottomnav a {
    padding: 10px;
    text-decoration: none;
    font-size: small;
    color: #f53;
    display: inline-block;
  }
  .bottomnav a.active,
  .bottomnav a:hover,
  .bottomnav a:focus {
    outline: none;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.85);
  }
  div[grid-col="2"][grid-pad="3"],
  div[grid-col="3"][grid-pad="3"] {
    display: none;
  }
  div[grid-col="7"][grid-pad="3"] {
    grid-col: 12;
  }
}

@media screen and (min-width: 1025px) {
  .bottomnav {
    display: none;
  }
}

@media screen and (max-height: 450px) {
  .sidenav {
    padding-top: 15px;
  }
  .sidenav a {
    font-size: smaller;
  }
}


    Go to:
    Overview
    Pipeline
    Workflow
    Tools
    Takeaways
  

  Go directly to:
  Overview
  Pipeline
  Workflow
  Tools
  Takeaways


      Art Critic AI Agent
      Building an autonomous, multimodal AI pipeline for daily creative critique and content generation.
      Link to Git Repo
    
    &#60;img width="2229" height="2229" width_o="2229" height_o="2229" data-src="https://freight.cargo.site/t/original/i/9aebd43c9ae41a649a47eacccade10a2160ec493f64d8e64c05508a858bd297d/ArtCritic.png" data-mid="236627151" border="0"  src="https://freight.cargo.site/w/1000/i/9aebd43c9ae41a649a47eacccade10a2160ec493f64d8e64c05508a858bd297d/ArtCritic.png" /&#62;
  

    Overview
    
      I built an automated AI agent that critiques my daily render artworks in my Everyday Project and outputs shareable video content for social platforms.
  

    Pipeline Breakdown
    
      Stage 1 – Text &#38;amp; Audio Generation

      
        Input: Daily render image from my ongoing Everyday project.
        Perception: The agent analyzes the image using OpenAI’s GPT-4o Vision API.
          Later replaced by local LLMs (Mistral, Llama3 via Ollama) for a free, offline workflow.
        
        Reasoning: Generates an art critique text based on the image content.
        Voice: Converts the critique text to audio narration.
          Initially used OpenAI TTS, later integrated free alternatives like Coqui TTS and Piper TTS.Bonus: Suggest an existing artwork related to the artwork critiqued.
        
      
      Stage 2 – Video Synthesis

      
        Combines:
          Daily render image (as static background)Audio narration
        
        Uses FFmpeg (open-source) to produce the final .mp4 video.
      
Prompt“Describe and critique this artwork in detail. &#38;nbsp;Also suggest an existing piece of art that is similar to this based on your analysis. Check and make sure that it is an existing artwork”


    Workflow Architecture
    &#60;img width="3399" height="136" width_o="3399" height_o="136" data-src="https://freight.cargo.site/t/original/i/25b914a799f01360cb448b79f1013a0aac4d9fd5830af615351148fed226dac5/Daily-Render-Image--Image-Analysis-LLMs--Critique-Text--Text-to-Speech--Audio-Narration---Image--Video-Output.png" data-mid="236687100" border="0"  src="https://freight.cargo.site/w/1000/i/25b914a799f01360cb448b79f1013a0aac4d9fd5830af615351148fed226dac5/Daily-Render-Image--Image-Analysis-LLMs--Critique-Text--Text-to-Speech--Audio-Narration---Image--Video-Output.png" /&#62;
  

	&#60;img width="1080" height="1350" width_o="1080" height_o="1350" data-src="https://freight.cargo.site/t/original/i/fd09773bd3a474d61866d92a646d9ebd9a101ce2abd8d890e396e557e75ea3b7/day0.png" data-mid="236627147" border="0"  src="https://freight.cargo.site/w/1000/i/fd09773bd3a474d61866d92a646d9ebd9a101ce2abd8d890e396e557e75ea3b7/day0.png" /&#62;
	&#60;img width="1184" height="1434" width_o="1184" height_o="1434" data-src="https://freight.cargo.site/t/original/i/aa467f77a42f24d644e3f321d5a1083cb7ae49b8b44454d9014a6a22fe5daefc/Screenshot-2025-03-22-at-00.59.10.png" data-mid="236627148" border="0"  src="https://freight.cargo.site/w/1000/i/aa467f77a42f24d644e3f321d5a1083cb7ae49b8b44454d9014a6a22fe5daefc/Screenshot-2025-03-22-at-00.59.10.png" /&#62;


    &#60;img width="852" height="1000" width_o="852" height_o="1000" data-src="https://freight.cargo.site/t/original/i/fc7e82f79dd181e43c8eb52aa4d143beac926be5717c55744aff9e0d79f4d0e6/Screenshot-2025-03-22-at-01.00.22.png" data-mid="236627149" border="0"  src="https://freight.cargo.site/w/852/i/fc7e82f79dd181e43c8eb52aa4d143beac926be5717c55744aff9e0d79f4d0e6/Screenshot-2025-03-22-at-01.00.22.png" /&#62;
  
  
    &#60;img width="749" height="600" width_o="749" height_o="600" data-src="https://freight.cargo.site/t/original/i/4d0043f10ae8b13aea88ca07ddd86d5c023024e46f8e26deb36a2b7066c1631b/the-discovery-of-fire-19351.jpgLarge.jpg" data-mid="236627152" border="0"  src="https://freight.cargo.site/w/749/i/4d0043f10ae8b13aea88ca07ddd86d5c023024e46f8e26deb36a2b7066c1631b/the-discovery-of-fire-19351.jpgLarge.jpg" /&#62;
  

    Tools &#38;amp; Technologies
    
      
        Text Generation: OpenAI GPT-4o, Mistral/Llama3 via Ollama
        Text-to-Speech: OpenAI TTS, Coqui TTS, Piper TTS
        Video Composition: FFmpeg
        APIs: Meta Graph API, YouTube Data API (explored for auto-posting)
      
    
    Key Takeaways
    
      
        Created a multi-modal AI Agent exhibiting perception → reasoning → action.
        Transition from paid APIs to a free, local-first setup, increasing accessibility and sustainability.
        Open to future extensions:
          
            Auto-posting to platforms
            Engagement-driven feedback loops
            Fully autonomous daily outputs
          
        
document.addEventListener("DOMContentLoaded", function() {
  const links = document.querySelectorAll('.sidenav a[href^="#"]');

  function adjustSidebarPosition() {
    let lastPassedSectionIndex = -1;

    links.forEach((link, index) =&#62; {
      const refElement = document.getElementById(link.getAttribute('href').substring(1));
      if (refElement) {
        const bounds = refElement.getBoundingClientRect();
        if (bounds.top  {
      link.classList.toggle('active', index === lastPassedSectionIndex);
    });
  }

  window.addEventListener('scroll', adjustSidebarPosition);
});
</description>
		
	</item>
		
		
	<item>
		<title>Dorian - MR Music Practice</title>
				
		<link>https://barthysuraj.com/Dorian-MR-Music-Practice</link>

		<pubDate>Mon, 04 Aug 2025 03:15:46 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/Dorian-MR-Music-Practice</guid>

		<description>

body {
  font-family: sans-serif; /* Ensuring clarity */
}

.video-full-width {
  width: 100%;
  height: auto;
  border-radius: 18px;
}

.sidenav {
  font-size: small; /* Consistency in appearance */
  color: rgba(255, 255, 255, 0.85);
  width: 7%;
  position: fixed;
  z-index: 1;
  top: 20%; /* Set to the final position */
  left: 83%;
  line-height: 2.5;
  overflow-x: hidden;
  padding: 8px 0;
  opacity: 1; /* Start with sidebar hidden */
  transition: opacity 2s; /* Smooth transition for opacity only */
}

.sidenav a,
.sidenav span {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  line-height: 2.5;
  font-size: small; /* Consistency in appearance */
  color: #f53;
  display: block; /* Ensure links are displayed as block for layout */
}

.sidenav span {
  font-weight: bold;
  color: rgba(255, 255, 255, 0.85);
}

.sidenav a.active {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  line-height: 2.5;
  font-weight: bold; /* Bold for active link */
}

.sidenav a:hover,
.sidenav a:focus {
  outline: 1px solid #f53; /* Orange outline for visibility */
  outline-offset: -2px; /* Adds space between the outline and the element border */
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  line-height: 2.5;
  font-weight: bold;
}

.main {
  padding: 0px 0px;
}

@media screen and (max-width: 1024px) {
  .sidenav {
    display: none;
  }
  .bottomnav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #333;
    padding: 10px 0;
    z-index: 1;
    overflow-x: auto; /* Allow horizontal scrolling */
    white-space: nowrap; /* Prevent items from wrapping */
  }
  .bottomnav span {
    padding: 0 10px;
    color: rgba(255, 255, 255, 0.85);
    font-size: small;
    font-weight: bold;
  }
  .bottomnav a {
    padding: 10px;
    text-decoration: none;
    font-size: small;
    color: #f53;
    display: inline-block; /* Ensure links are displayed inline for scrolling */
  }
  .bottomnav a.active,
  .bottomnav a:hover,
  .bottomnav a:focus {
    outline: none;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.85);
  }
  div[grid-col="2"][grid-pad="3"],
  div[grid-col="3"][grid-pad="3"] {
    display: none; /* Hide empty columns on mobile */
  }

  div[grid-col="7"][grid-pad="3"] {
    grid-col: 12; /* Adjust the middle column to full width */
  }
}

@media screen and (min-width: 1025px) {
  .bottomnav {
    display: none; /* Hide bottomnav on desktop */
  }
}

@media screen and (max-height: 450px) {
  .sidenav {
    padding-top: 15px;
  }
  .sidenav a {
    font-size: smaller;
  }
}


    Go to:
    
    Context
    Video
  

  Go directly to:
    Role
    Context
    Video


      Dorian
      Mixed Reality Practice Tool for Musicians.
      Process Deck
    
    &#60;img width="2229" height="2229" width_o="2229" height_o="2229" data-src="https://freight.cargo.site/t/original/i/0b1b189272e7607b93a7928238f062fac31fe8a1f8f6593b0a8a642b5bb0da73/dorian.png" data-mid="236627188" border="0"  src="https://freight.cargo.site/w/1000/i/0b1b189272e7607b93a7928238f062fac31fe8a1f8f6593b0a8a642b5bb0da73/dorian.png" /&#62;
  

    Context
    ‘Dorian’ is a mixed reality practice tool for musicians where they can see their instrument and a virtual audience at the same time. The audience and their virtual band react to their playing like a real audience would; cheer when they play right and boo when they play wrong. This experience helps them practice in front of an audience without the need to be afraid.

  
    Video
    

document.addEventListener("DOMContentLoaded", function() {
  const sidebar = document.querySelector('.sidenav');
  const links = document.querySelectorAll('.sidenav a[href^="#"]');

  function adjustSidebarPosition() {
    let lastPassedSectionIndex = -1;

    links.forEach((link, index) =&#62; {
      const refElement = document.getElementById(link.getAttribute('href').substring(1));
      if (refElement) {
        const bounds = refElement.getBoundingClientRect();
        if (bounds.top  {
      link.classList.toggle('active', index === lastPassedSectionIndex);
    });
  }

  window.addEventListener('scroll', adjustSidebarPosition);
});
</description>
		
	</item>
		
		
	<item>
		<title>Everyday GAN - StyleGAN2</title>
				
		<link>https://barthysuraj.com/Everyday-GAN-StyleGAN2</link>

		<pubDate>Mon, 04 Aug 2025 03:15:50 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/Everyday-GAN-StyleGAN2</guid>

		<description>

body {
  font-family: sans-serif; /* Ensuring clarity */
}

.video-full-width {
  width: 100%;
  height: auto;
  border-radius: 18px;
}

.sidenav {
  font-size: small; /* Consistency in appearance */
  color: rgba(255, 255, 255, 0.85);
  width: 10%;
  position: fixed;
  z-index: 1;
  top: 20%; /* Set to the final position */
  left: 90%;
  line-height: 2.5;
  overflow-x: hidden;
  padding: 8px 0;
  opacity: 1; /* Start with sidebar hidden */
  transition: opacity 2s; /* Smooth transition for opacity only */
}

.sidenav a,
.sidenav span {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  line-height: 2.5;
  font-size: small; /* Consistency in appearance */
  color: #f53;
  display: block; /* Ensure links are displayed as block for layout */
}

.sidenav span {
  font-weight: bold;
  color: rgba(255, 255, 255, 0.85);
}

.sidenav a.active {
  color: #f53;
  text-decoration: none;
  line-height: 2.5;
  font-weight: bold; /* Bold for active link */
}

.sidenav a:hover,
.sidenav a:focus {
  outline: 1px solid #f53; /* Orange outline for visibility */
  outline-offset: -2px; /* Adds space between the outline and the element border */
  color: black;
  text-decoration: none;
  line-height: 2.5;
 
}

.main {
  padding: 0px 0px;
}

@media screen and (max-width: 1024px) {
  .sidenav {
    display: none;
  }
  .bottomnav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #333;
    padding: 10px 0;
    z-index: 1;
    overflow-x: auto; /* Allow horizontal scrolling */
    white-space: nowrap; /* Prevent items from wrapping */
  }
  .bottomnav span {
    padding: 0 10px;
    color: rgba(255, 255, 255, 0.85);
    font-size: small;
    font-weight: bold;
  }
  .bottomnav a {
    padding: 10px;
    text-decoration: none;
    font-size: small;
    color: #f53;
    display: inline-block; /* Ensure links are displayed inline for scrolling */
  }
  .bottomnav a.active,
  .bottomnav a:hover,
  .bottomnav a:focus {
    outline: none;
    font-weight: bold;
    color: rgba(255, 255, 255, 0.85);
  }
  div[grid-col="2"][grid-pad="3"],
  div[grid-col="3"][grid-pad="3"] {
    display: none; /* Hide empty columns on mobile */
  }

  div[grid-col="7"][grid-pad="3"] {
    grid-col: 12; /* Adjust the middle column to full width */
  }
}

@media screen and (min-width: 1025px) {
  .bottomnav {
    display: none; /* Hide bottomnav on desktop */
  }
}

@media screen and (max-height: 450px) {
  .sidenav {
    padding-top: 15px;
  }
  .sidenav a {
    font-size: smaller;
  }
}


    Go to:
    Generations
    Dataset
  

  Go directly to:
    Generations
    Dataset


      Everyday GAN
      Generating images using StyleGAN2 from the first 2285 days of my Everyday Project.
      Link to Colab Notebook
      Link to Git Repo


    Generations
    
      Everyday GAN - Some of the generations

&#60;img width="540" height="304" width_o="540" height_o="304" data-src="https://freight.cargo.site/t/original/i/6a807c81cdacc16bf0a3c3c60351e2ac740cbac042bf3dc3761c179bca0015a3/Comp-1.gif" data-mid="236627228" border="0" data-scale="100" src="https://freight.cargo.site/w/540/i/6a807c81cdacc16bf0a3c3c60351e2ac740cbac042bf3dc3761c179bca0015a3/Comp-1.gif" /&#62;
  

    Dataset Prep
    I have a structure to all the files in my Everyday Project. All the days are tagged and numbered. For this exercise, I looked at the first 2285 days and excluded most of the videos. For some of the then recent ones, I used one frame from the video. The dataset in the end was 1,822 images.
      &#60;img width="3102" height="21067" width_o="3102" height_o="21067" data-src="https://freight.cargo.site/t/original/i/8c9e4804710bb75463731a5438ab04733e0b1fc740a6ff92aa690909f28d9361/gans-mid.jpg" data-mid="236627229" border="0"  src="https://freight.cargo.site/w/1000/i/8c9e4804710bb75463731a5438ab04733e0b1fc740a6ff92aa690909f28d9361/gans-mid.jpg" /&#62;


document.addEventListener("DOMContentLoaded", function() {
  const sidebar = document.querySelector('.sidenav');
  const links = document.querySelectorAll('.sidenav a[href^="#"]');

  function adjustSidebarPosition() {
    let lastPassedSectionIndex = -1;

    links.forEach((link, index) =&#62; {
      const refElement = document.getElementById(link.getAttribute('href').substring(1));
      if (refElement) {
        const bounds = refElement.getBoundingClientRect();
        if (bounds.top  {
      link.classList.toggle('active', index === lastPassedSectionIndex);
    });
  }

  window.addEventListener('scroll', adjustSidebarPosition);
});
</description>
		
	</item>
		
		
	<item>
		<title>Viva Desktop</title>
				
		<link>https://barthysuraj.com/Viva-Desktop</link>

		<pubDate>Fri, 22 Aug 2025 04:36:33 +0000</pubDate>

		<dc:creator>Suraj Barthy</dc:creator>

		<guid isPermaLink="true">https://barthysuraj.com/Viva-Desktop</guid>

		<description>

/* ——— existing styles from your page ——— */
body { font-family: sans-serif; }
.sidenav { position: fixed; z-index: 1; top: 20%; left: 90%; width: 10%; line-height: 2.5; overflow-x: hidden; padding: 8px 0; opacity:1; transition: opacity 2s; }
.sidenav a { padding: 6px 8px 6px 16px; text-decoration: none; line-height: 2.5; font-size: small; color: #f53; display: block; }
.sidenav a.active { color:#f53; font-weight: bold; }
.sidenav a:hover, .sidenav a:focus { outline:1px solid #f53; outline-offset:-2px; color:black; }
.main { padding:0 0; }

@media screen and (max-width:1024px){
  .sidenav{ display:none; }
  .bottomnav{ display:flex; align-items:center; justify-content:flex-start; position:fixed; bottom:0; left:0; width:100%; background:#333; padding:10px 0; z-index:1; overflow-x:auto; white-space:nowrap; }
  .bottomnav span{ padding:0 10px; color:rgba(255,255,255,.85); font-size:small; font-weight:bold; }
  .bottomnav a{ padding:10px; text-decoration:none; font-size:small; color:#f53; display:inline-block; }
  .bottomnav a.active, .bottomnav a:hover, .bottomnav a:focus{ outline:none; font-weight:bold; color:rgba(255,255,255,.85); }
  div[grid-col="2"][grid-pad="3"], div[grid-col="3"][grid-pad="3"]{ display:none; }
  div[grid-col="7"][grid-pad="3"]{ grid-col:12; }
}
@media screen and (min-width:1025px){ .bottomnav{ display:none; } }
@media screen and (max-height:450px){ .sidenav{ padding-top:15px; } .sidenav a{ font-size:smaller; } }

/* Impact styles */
.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.metric-card {
  background: #ECECEC;
  border-radius: 12px;
  padding: 18px 20px;
}
.metric-kicker {
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #333;
  opacity: .8;
}
.metric-value {
  font-size: 36px;
  font-weight: 800;
  line-height: 1.2;
  margin: 4px 0 8px 0;
}
.metric-trend {
  font-size: 14px;
  font-weight: 700;
  opacity: .85;
}
.metric-desc {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.45;
}
.metric-foot {
  margin-top: 14px;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #6e6e6e;
}

/* Responsive */
@media (max-width: 1024px){
  .metric-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px){
  .metric-grid { grid-template-columns: 1fr; }
}


    Go to:
    Context
        Role
                Impact
    Search &#38;amp; Discovery
    My Learning
  Personalization
    Featured

    Details &#38;amp; Sharing
  

  Go directly to:
  Context
    Role
        Impact
  Search &#38;amp; Discovery
  My Learning
  Personalization
    Featured
  Details &#38;amp; Sharing


      Launching Microsoft Viva Learning - Desktop &#38;amp; Web
      
      
        Complete mobile flows and desktop handoff to bring learning to the flow of work, with a key focus on Accessibility.
      
    
    Context
    
      Part of the Microsoft Viva suite, integrated with Teams.
 Primary surfaces: desktop web and Teams app.
      
      
    Role
    
      Led design across Search &#38;amp; Discovery, My Learning dashboard, Personalization, and admin-driven Featured content. Focused on scalable patterns, accessibility (WCAG), and cross-surface consistency.
    
  
    Impact
  
  
    Key metrics measured after one year of GA launch.
  

        Reduction
        50%
        ▼ Onboarding time
        Time from onboarding to full productivity.
        Outside Microsoft
      

        Reduction
        20%
        ▼ Employee attrition
        Lower attrition driven by improved engagement.
        Outside Microsoft
      

        Increase
        58%
        ▲ Engaged quality learners
        Employees completing 2+ elective courses per month.
        Inside Microsoft
      

        MAU
        169k
        ▲ Monthly active users
        Including ~40,000 active mobile users.
        Inside Microsoft
      

    Search &#38;amp; Discovery
    
      Redesigned search to improve filtering, sorting, error handling, and results legibility across large catalogs.
      
        
	&#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/74609b8c1947f3b7bc5e64331a23b1f25ebc72204c4f05f8ec02828277832caf/search2.jpg" data-mid="237326441" border="0"  src="https://freight.cargo.site/w/1000/i/74609b8c1947f3b7bc5e64331a23b1f25ebc72204c4f05f8ec02828277832caf/search2.jpg" /&#62;Inline results (Image 1): Quick search with inline suggestions surfaces the most relevant courses immediately, helping learners act without leaving their flow.


	&#60;img width="4320" height="2430" width_o="4320" height_o="2430" data-src="https://freight.cargo.site/t/original/i/44598a207c7ca6ffe679305f8cae187158320913021278cd6a46fbdda125e61d/search3.jpg" data-mid="237326442" border="0"  src="https://freight.cargo.site/w/1000/i/44598a207c7ca6ffe679305f8cae187158320913021278cd6a46fbdda125e61d/search3.jpg" /&#62;Full results with filters (Image 2): Expanded search results include rich filters by duration, format, and provider, making it easier to explore and compare content across large catalogs.


    My Learning
    
      Created scalable dashboard patterns for assigned, saved, and in-progress learning, with quick actions and progress cues.
    
  
    &#60;img width="3180" height="3779" width_o="3180" height_o="3779" data-src="https://freight.cargo.site/t/original/i/c7d778c6cfc8784d59c8252af937fdf61a2b7baba85a715e5012bdb32183450e/day0.png" data-mid="237326443" border="0"  src="https://freight.cargo.site/w/1000/i/c7d778c6cfc8784d59c8252af937fdf61a2b7baba85a715e5012bdb32183450e/day0.png" /&#62;
      Day 0: Home overview (Image 1):
        The home surface balances organizational priorities and personal relevance: featured content set by admins, personalization prompts, trending topics in the org, and a categorized library for exploration.
      
    
    &#60;img width="3201" height="3779" width_o="3201" height_o="3779" data-src="https://freight.cargo.site/t/original/i/348357660055efd812c9fcc5b80ef13fa3a256d52c0e1122326d63c1248b6bd8/dayn.png" data-mid="237326444" border="0"  src="https://freight.cargo.site/w/1000/i/348357660055efd812c9fcc5b80ef13fa3a256d52c0e1122326d63c1248b6bd8/dayn.png" /&#62;
      Day N: Personalized snapshot (Image 2):
        Returning users see a dashboard with assigned courses, recommended learning, and recently viewed items alongside personalization and trending content.
      
    
    Personalization
    
      Interest selection and recommendations to raise relevance on the home surface.
    
  
    &#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/063d50ea743fa1f9710d850473a74ef65740aa9c457b69fea03e8298654e365a/personal1.jpg" data-mid="237326448" border="0"  src="https://freight.cargo.site/w/1000/i/063d50ea743fa1f9710d850473a74ef65740aa9c457b69fea03e8298654e365a/personal1.jpg" /&#62;
      
        Lightweight prompt (Image 1):
        Onboarding invites learners to pick interests from the home screen, making personalization effortless.
      
    
    &#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/123a558f998128dae507d5a0b5998cc8f9aa2afca6451a793b07548207632a4f/personal2.jpg" data-mid="237326449" border="0"  src="https://freight.cargo.site/w/1000/i/123a558f998128dae507d5a0b5998cc8f9aa2afca6451a793b07548207632a4f/personal2.jpg" /&#62;
      
        Refine interests (Image 2):
        A searchable modal with tags lets users fine-tune preferences so recommendations feel tailored.
      
    
    &#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/29a92dcc18065ea88fa6926940079231ea30d1ff1d60149fd766d45c6546d47a/personal3.jpg" data-mid="237326450" border="0"  src="https://freight.cargo.site/w/1000/i/29a92dcc18065ea88fa6926940079231ea30d1ff1d60149fd766d45c6546d47a/personal3.jpg" /&#62;
      
        See the payoff (Image 3):
        The home view updates instantly with recommended courses based on saved interests.
      
    
    Featured Content (Admin)
    
      Enable orgs to promote priority learning with configurable banners.
    
  
    &#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/d49d0cecabd78458bb0aed597c719bd0eaf7f57f747d9168bf0c5b9fd9181cb0/Admin-FC.png" data-mid="237326466" border="0"  src="https://freight.cargo.site/w/1000/i/d49d0cecabd78458bb0aed597c719bd0eaf7f57f747d9168bf0c5b9fd9181cb0/Admin-FC.png" /&#62;
      
        Admin dashboard (Image 1):
        Admins create, schedule, and manage featured sets to control which learning is promoted to employees.
      
    
    &#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/83391ca54d5f71391726a4a4a433c2e3a2cb07db3c1f30cfbda223746b5c6991/Pre-curated-FC.png" data-mid="237326467" border="0"  src="https://freight.cargo.site/w/1000/i/83391ca54d5f71391726a4a4a433c2e3a2cb07db3c1f30cfbda223746b5c6991/Pre-curated-FC.png" /&#62;
      
        Featured banner (Image 2):
        Selected featured content appears as a prominent banner on the home screen for maximum visibility.
      
    
    Details &#38;amp; Sharing
    
      Streamlined course details for quick evaluation and lightweight sharing to support peer discovery in Teams.
    
  
    &#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/5a39fcf2393a0faa0b079c64648cefed66cae3a2190e52a2810f9bd59a14f3c6/share.png" data-mid="237326508" border="0"  src="https://freight.cargo.site/w/1000/i/5a39fcf2393a0faa0b079c64648cefed66cae3a2190e52a2810f9bd59a14f3c6/share.png" /&#62;
      
 Course details (Image 1):
        Rich metadata, related content, and quick actions to share via Teams, mail, or link make resources easy to evaluate and distribute.
    
    &#60;img width="1440" height="810" width_o="1440" height_o="810" data-src="https://freight.cargo.site/t/original/i/7696a0c212321394cc78b57b262bebc35741c6c323c68dfd16f6682b6ebfbbdf/shared.png" data-mid="237326507" border="0"  src="https://freight.cargo.site/w/1000/i/7696a0c212321394cc78b57b262bebc35741c6c323c68dfd16f6682b6ebfbbdf/shared.png" /&#62;
      
        Share in chat (Image 2):
        Share courses directly in Teams conversations to spark peer-to-peer discovery.
      
    
      Happy to walk through the live Figma files and interview deck for flows, decisions, and impact.
    
  
/* keep your active-link scroll behavior */
document.addEventListener("DOMContentLoaded", function() {
  const links = document.querySelectorAll('.sidenav a[href^="#"]');
  function adjustSidebarPosition() {
    let last = -1;
    links.forEach((link, i) =&#62; {
      const el = document.getElementById(link.getAttribute('href').substring(1));
      if (el &#38;&#38; el.getBoundingClientRect().top  link.classList.toggle('active', i === last));
  }
  window.addEventListener('scroll', adjustSidebarPosition);
  adjustSidebarPosition();
});
</description>
		
	</item>
		
	</channel>
</rss>